html 按钮点击事件

Question

我创建了一个 div 定义如下

       <div class="area1">
        </div>

通过这个 ajax 调用，我更改了上面的 html div

$('#abutton').click(function(e) {
    e.preventDefault();
    $.ajax({
        url: 'do',
        type: 'POST',
        dataType: 'json',
        cache: false,
        data: {id:this.id},
        success: function(data) {
            $('.area1').html(data);
        },
        failure: function() {
            alert('Please try again..!');
        }
    });
});

现在div内容是这样的

       <div class="area1">
            <input type="text" placeholder='Name'>
            <button id='submit'>Submit</button>
        </div>

现在我想在按钮点击时执行一些操作

$('.area1 button').click(function(e){
    e.preventDefault();
    alert(this.id) ;
});

但是这第二个 ajax 没有选择按钮

谁能说出正确的方法

Answer 1

$(document).on("click","div.area1 button",function(e) {
  e.preventDefault();
  alert(this.id) ;
});

你可以试试这个

如果您的页面正在动态创建元素，您可以将事件绑定到已经存在的父级（这是这里问题的核心，您需要绑定到现有的东西，不要绑定到动态内容），这可以是（也是最简单的选择）文档。

html 按钮点击事件

html button click event

html

ajax

jquery