Jquery事件不会从.html加载的内容中触发

Jquery events not firing from inside .html loaded content

本文关键字:加载 事件 html Jquery      更新时间:2023-09-26

这里是一个场景,我有一个列表,根据点击的内容加载一些HTML到div中:

<ul id="menu">
  <li id="empNav1" class="selected"><a href="#">Employer Overview</a></li>
  <li id="empNav2"><a href="#">Why We're Better</a></li>
  <li id="empNav3"><a href="#">Job Slots + Resume DB</a></li>
</ul>
<div class="subItem"></div>

--------- jquery ------------

$(document).ready(function () {
   var sections = $("#menu li");
   var content = $(".subItem");

sections.click(function () {
    switch (this.id) {
        case "empNav1":
           content.html('<ul><li id="submenu1">11111</li><li>1111</li></ul>');
           break;
        case "empNav2":
            content.html('<ul><li id="submenu2">222222</li>li>22222</li></ul>');
            break;
        case "empNav2":
            content.html('<ul><li id="submenu3">333333</li>li>33333</li></ul>');
            break;
}
});
   $('li#submenu1').click(function {
       content.html('<ul><li id="submenu2">222222</li>li>22222</li></ul>');
       });     
    });

所以我的问题是:我如何让事件触发的内容加载在。html事件?我试过一些方法,但都不起作用。我希望加载的内容能够触发影响页面的事件

问题源于doc.ready上没有内容。用这个代替

$('li#submenu1').live(function {
   content.html('<ul><li id="submenu2">222222</li>li>22222</li></ul>');
   });     
});

并查看.live docs http://api.jquery.com/live/

$('li#submenu1').live('click', function {
    content.html('<ul><li id="submenu2">222222</li>li>22222</li></ul>');
});