JS實現下拉框懸浮顯示實際值

1.1 版本

1.2 問題描述

下拉框的資料字典中設定了實際值與顯示值，展示的時候只能看到顯示值，希望滑鼠放上去的時候，可以懸浮顯示實際值，如下：

1.3 實現思路

利用 JS 獲取當前的顯示值，結合 FR 的公式獲取到實際值，再顯示出來。

2.1 範本設計

1）建立一個資料查詢 ds1，SELECT user,name FROM user，如下圖所示：

2）拖一個下拉複選框到參數面板，設定資料字典如下：

3）選中下拉框，新增編輯前事件，選擇 Javascript 腳本，如下圖所示：

JS 程式碼如下：

$(".fr-combo-list-item").mousemove(function(){
        var a=$(this).attr("title");
        var val=FR.remoteEvaluate("map('"+a+"','ds1',2,1)");
        if(val!=""){ 
        $(this).attr("title",val);}
        });

2.2 效果預覽

2.2.1 PC 端

點選儲存，選擇分頁預覽，效果如 1.2 節所示。

2.2.2 行動端

点击下载模板：下拉選項懸浮顯示實際值.cpt