0

我需要根据角色动态绑定菜单,因此我将字符串与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());
});

click 事件没有被触发,但是,当我在小提琴中测试它时,它工作正常。

我的整个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()); });        
});

为什么没有在网站中触发点击事件的任何建议?

提前致谢

4

3 回答 3

2

您的选择器不正确,您正在使用类选择器按 ID 选择元素,还将您的代码放入文档就绪处理程序中,如果您想获取元素的文本内容,您应该使用text而不是html.

$(document).ready(function(){
    $('#mainid li a').click(function(event) {
         alert($(this).text()); 
         // event.preventDefault()  prevents the default action of the event
    });
})
于 2012-09-26T06:10:47.197 回答
0

像这样试试

$('ul>#mainid>ul>li').click(function () {
        alert($(this).html()); 
});
于 2012-09-26T06:09:56.730 回答
0

选择器错误..您正在尝试访问类而不是 id.. 试试这个

$('#jqxMenu li')

试试这个代码

$('#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());
});​

检查小提琴

于 2012-09-26T06:15:30.780 回答