Question

我在ajax中添加了按钮，它有onclick个事件。

if(response.status == "SUCCESS"){
    steps = "";
    for(i = 0 ; i < response.result.length ; i++){
      steps +="<br>
      <div >
        <input type='button' value='ok'   id='button'   onclick='action()' class='button'>
      </div>";
     }
     $('#info').html(steps);
}

当我点击按钮时，按钮的动作没有提升。为什么？

Answer 1

尝试：

$('#info').html(steps).find('.button').on("click", action);

并从按钮的HTML中删除onclick属性。

似乎可能因为您在页面加载后添加了这些元素，因为它们的onclick属性没有向元素添加事件处理程序。

此外，您已经获得了一个循环，为每个元素提供相同的ID，但ID应该是唯一的。

Answer 2

请将您的代码更改为此内容 - 尽量不要复制IDs，它们应该是唯一的并且避免使用内联JS：

if(response.status == "SUCCESS") {
    steps = "";
    for(i = 0 ; i < response.result.length ; i++){
        steps +="<br><div ><input type='button' value='ok' class='button'></div>";
    }
    $('#info').html(steps);
}

然后单独使用它，而不是在任何循环中。

$(function() {
    $('#info').on('click', 'input.button', action);
});

使用ajax添加按钮时操作无效

2 个答案: