This question already has answers here:
Event binding on dynamically created elements?

(23个答案)


5年前关闭。




谁能告诉我为什么下面的代码仅在链接#1和链接#2上显示“ Hello world”警报?

链接#3是在执行ajax调用后生成的,而click事件似乎根本不可用。我不知道为什么。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Test Page</title>
    <script src="media/js/jquery-1.10.2.js"></script>
    <script src="media/js/jquery-ui.js"></script>
    <script type="text/javascript" charset="utf-8">
        $(document).ready(function() {

          $("#message").append('<a href="#" class="view_comments" id="2">Link #2</a><br />\n');

          $(".view_comments").click(function()
            {
            alert('Yes it worked!');
          });

          UpdateDiv();

          function UpdateDiv() {
            var var_1 = "1";
            var var_2 = "2";
            $.getJSON('file.php', {var1: var_1, var2 : var_2},function(json_result){
              $("#message").append('<a href="#" class="view_comments" id="3">Link #3</a><br />\n');
              $("#message").show();
            });
          }

        });
    </script>
    </head>
    <body>
        <div id="message" name="message"><a href="#" class="view_comments" id="1">Link #1</a><br /></div>
    </body>
</html>

最佳答案

Delegate您的click事件:

$('body').on( 'click', ".view_comments", function()

关于jquery - $ .getJSON调用-元素上的click事件丢失,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/24682487/

10-12 05:26