jquery代码中的一个追加和单击函数



这是我下面的test.html文件

<!DOCTYPE html>
    <html>
      <head>
          <style>
              p { 
                  background:yellow; 
              }
              .content{
                  width:40px;
                  margin:0px 30px;
              }
          </style>
          <script src="http://code.jquery.com/jquery-latest.js"></script>
          <script>
              $(document).ready(function(){
                  $('#test').click(function(){
                     // alert("test");
                     var htmlData='<div class="resizable" ><div class="content">test</div></div>';
                     $('.container').append(htmlData);
                  });
                  $('.content').click(function(){
                     alert("test");
                  });
              });
          </script>
     </head>
     <body>
         <div class="container">
             <div class="resizable" >
                 <div class="selected content">Time</div>
                 <button type="button" id="test">Click Me!</button>
             </div>
         </div>
    </body>
</html>

当我点击按钮一个div被追加,我也有类内容上的点击函数被写入,称为警报。内容类的jquery click函数会调用硬编码的内容类,但不会调用由button的click函数附加的内容类

您需要为动态创建的DOM元素使用live函数- http://api.jquery.com/live/

$('.content').live('click', function(){
   alert("test");
});
$("body").delegate("#test", "click", function(){
      //write your code here
});

最新更新