JavaScript在页面加载后仅运行一次

Question

This script is triggered only once when the page loads. The page has loaded, click the link, the data came from. Click the link again, nothing. Overload the page, the link works, etc. What is wrong in the script, why it triggered only once?

<script>
    $(function() {
        $('a').click(function() {
            $.get('ajax', function(data) {
                $('#mydiv').html(data);
            });
        });
    });
</script>

<div id="mydiv">
    <a href="#">Update the div!</a>     
</div>

Compared the data in the "mydiv" before and after clicking the link: before clicking the link

<div id="mydiv">
    <a href="#">
        Update the div!
    </a>
</div>

after link was cliked

<div id="mydiv">
    <a href="#">
            Update the div!
            <!--Here is the data that came from.-->
    </a>
</div>

Answer 1

Because you're overwriting the a tag that you attached the click event to, you'd need to rerun the code that attaches the click event again. Or you could use event delegation like blex suggests:

$(document).on("click", "a", function(){

}

Answer 2

由于是动态创建a您应该使用：

$(document).on("click", "a", function() {