ロールに基づいてメニューを動的にバインドする必要があるため、文字列をul
&li
タグで連結しました。
選択したテキストをラベルに表示する必要があるため、クリック イベントを追加しましたが、発生しません。
HTML コード
<div id='jqxWidget' style='height: 30px; display: none;background-color:#e8e8e8'>
<div id='jqxMenu' style='margin-left: 20px;'></div>
</div>
クリックイベント
$('.jqxMenu li').click(function () {
alert($(this).html());
});
jqxmenu にバインドされた文字列
<ul id='mainid'>
<li><a href=#>Operations</a>
<ul style='width: 150px;'>
<li><a href=default.aspx?src=1010>Booking</a></li>
<li><a href=default.aspx?src=1009>Manifest </a></li>
<li><a href=default.aspx?src=1002>RunSheet</a></li>
<li><a href=default.aspx?src=1004>Delivery Updation</a></li>
<li><a href=default.aspx?src=1007>Recovery</a></li>
<li><a href=default.aspx?src=100>Local Manifest Branch</a></li>
<li><a href=default.aspx?src=5501>Extras</a></li>
<li><a href=default.aspx?src=2300>Bulk Import</a></li>
</ul>
</li>
</ul>
たとえば、Manifest
が選択されている場合、クリック イベントのラベルにそのテキストを表示する必要があります。ただし、点火しない...
クリックイベント用に以下のコードを試しました:
$('#jqxMenu li').click(function (e) {
e.preventDefault(); // Check if the li has a parent .. To prevent double firing of li
if ($(this).parents('li').length) {
e.stopPropagation();
}
alert($(this).html());
});
クリック イベントは発生しませんが、フィドルでテストしたところ、正常に動作しています。
私のjQueryコード全体は次のとおりです。
$(document).ready(function () {
var theme = getTheme();
$('#jqxMenu li').click(function (e) {
e.preventDefault(); // Check if the li has a parent .. To prevent double firing of li
if ($(this).parents('li').length) {
e.stopPropagation();
}
alert($(this).html());
});
$("#jqxMenu").css('visibility', 'visible');
$("#jqxMenu").jqxMenu({ width: '600', height: '30px', theme: theme });
$("#open").bind('change', function (event) {
$("#jqxMenu").jqxMenu({ autoOpen: true });
});
$('#jqxMenu').bind('itemclick', function () {
$('#selid').val($(event.args).text()); });
});
Web サイトでクリック イベントが発生しない理由を教えてください。
前もって感謝します