この記事では主に easyUI のドロップダウン リストのクリック イベントの使用方法を詳しく紹介します。興味のある方はぜひ参考にしてください。
この記事の例では、参考のために easyUI ドロップダウン リストのクリック イベントを使用する方法を共有します。具体的な内容は次のとおりです
input と select
を使用してドロップダウン リストを作成できます。 select は次のように作成されます:
json を渡して js 配列を作成します
[{ "id":1, "text":"text1" },{ "id":2, "text":"text2" },{ "id":3, "text":"text3", "selected":true },{ "id":4, "text":"text4" },{ "id":5, "text":"text5" }]
例:
html コード スニペット:
<select id="in_edit_netlink" style="width:160px;" class="easyui-combobox" data-options="valueField:'id',textField:'text',editable:false" > </select>
js コード スニペット:
var ljfsArray = new Array(); var objHTTP = new Object(); objHTTP.text = "HTTP"; var objTCP = new Object(); objTCP.text = "TCP"; objTCP.id = 1; objHTTP.id = 2; if (data.ljfs == "HTTP") { objHTTP.selected=true; } else { objTCP.selected=true; } ljfsArray.push(objHTTP); ljfsArray.push(objTCP); $('#in_edit_netlink').combobox('loadData', ljfsArray);
ページ効果の表示:
プロパティの説明:
valueField:'id'---objTCP.id--->オプション値value
textField:'text'---objTCP.text--->ページ表示値
objTCP .selected=true; ---> デフォルトの表示は
クリック変更イベント
onSelectはonChange
と同等ですが、問題はonChangeがeasyUIでサポートされておらず、onSelectがhtmlでサポートされていないことです。
onSelect は js コードで使用する必要があります:
$("#in_edit_netlink").combobox({ onSelect: function () { connectionType = $('#in_edit_netlink').val(); if (connectionType == 1) { $('#in_edit_sjjh').textbox('setValue', tcpIp); } else { $('#in_edit_sjjh').textbox('setValue', httpIp); } } })
Use
$(function () { })
デフォルトでロードされた後、onSelect イベントは通常どおり使用できます。
関連する推奨事項:
EasyUI Dateboxの開始日が終了時刻より前のインスタンス共有の日付検証
easyUIのドラッグ操作におけるドロップ可能とドラッグ可能の使用例
インラインの詳細な説明EasyUI での dataGrid の編集例
以上がEasyUI ドロップダウン リストのクリック イベントの使用例の共有の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。