我无法使用jquery访问我的元素

时间:2014-09-18 12:59:39

标签: php jquery html

您好,我想访问页面上的按钮,但是当我点击按钮时没有任何反应

请指导我



$(document).ready(function() {
  $('#cart_inside').load('php/load_Cart.php',function(e){
    $('.add_to_cart').click(function(e) {
      var id = $(this).next().val();
      $.post("php/cart_add.php", {
        id: id
      }, function(e) {
        $('#cart_inside').append("<span>" + e + "</span><button></button>");
      });
    });

    $('button').click(function(e){
      alert('hi');
    });	    
  });
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="cart">
  <div id="cart_inside"></div>
  <a href="php/cart_remove_all.php">empty cart</a>
  <div id="buy">
    <a href="final_cart.php">cart</a>
  </div>
</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:4)

事件处理程序仅绑定到当前选定的元素;它们必须存在于您的代码进行事件绑定调用时的页面上。

您需要使用Event Delegation委托事件方法{。}}来使用.on()

  

委派事件的优点是,它们可以处理来自稍后添加到文档的后代元素的事件。通过选择在附加委托事件处理程序时保证存在的元素。

$(document).on('event','selector',callback_function)

示例

$(document).ready(function() {
    $('#cart_inside').append("<button>button</button>");
    $('#cart_inside').on('click', 'button', function(){
      alert('hi');
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cart_inside'></div>