Question

为什么我的按钮B没有显示警告弹出窗口？

以下是我在不同文件中的代码

html的：

<html>
<body>
    <input type="button" class="popup" value="BUTTON A"/><br>
    <input type="button" class="displaymeh" value="SHOW"/>
<div id="display">
</div>  

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="script.js"></script>
</body>
</html>

.PHP：

<?php
    echo "<input type='button' class='popup2' value='BUTTON B'/>";
?>

的.js：

$(".popup").on('click', function(){
    alert("HELLO WORLD!");
});

$(".popup2").on('click', function(){
        alert("HELLO WORLD! 2");
});

$(".displaymeh").on('click', function(){
    $.ajax({
        url: 'display.php',
        success: function(data) {
        $('#display').html(data);
        }
    });
});

我把按钮放在.php里面的原因是因为我打算在php里面显示数据库表，而按钮则用来管理数据库，比如删除。

编辑：不，这与.on（'click'）vs .click（）之间的区别不一样，为什么我在1小时内已经有负面的投票，我永远不会知道。

Answer 1

每页只允许1 id个同名。 id属性必须是唯一的。你可以通过给它一个不同的ID（id="popup2"）单独绑定BUTTON B，或者给它一个类而不是id，然后使用类绑定器：

您的HTML也无效。创建如下输入：

<input type="button" class="popup" value="BUTTON A" />
<br>
<input type="button" class="displaymeh" value="SHOW" />
<input type='button' class='popup' value='BUTTON B' />

另一个问题是该元素在页面加载时根本不存在。每当你向dom添加新的HTML时，你都必须重新进行绑定！像这样：

JS：

$(function() {
  //set the button bindings initially
  setButtonBindings();

  $(".displaymeh").on('click', function() {
    $.ajax({
      url: 'display.php',
      success: function(data) {
        $('#display').html(data);
        //re-set the button bindings after html has been added
        setButtonBindings();
      }
    });
  });

});

function setButtonBindings() {
  $('.popup').off("click"); //so it won't trigger multiple times
  $('.popup').on("click", function() {
    alert("I like cheese");
    return false;
  });
}

- 尝试使用.on("click")此类绑定，而不是.click();。它更可靠，.click()这些是不推荐使用的函数。它们甚至在jQuery 3.x中被完全删除

您好，为什么我的按钮B不起作用？

1 个答案: