jQuery .load() function only gets called once

问题

##### SOLVED ##### I had a javaScript refresh setInterval("...", 1000); in the source code which caused the error. Thanks a lot for your help!

the html

<div class="stackwrapper" id="user1"></div>
<div class="stackwrapper" id="user2"></div>
<div class="userdrawings"></div>

the javascript

$('.stackwrapper').click(function(e){
var id=$(this).attr('id');
$('.userdrawings').load('loadSession.php?user='+id).fadeIn("slow");
});

Somehow it only works at once, only at the first click on stackwrapper, when I click on the second one, the function is not triggered again.

回答1:

Okay now i get it, it's because you're making ajax call. Here's a link that answers your question.

回答2:

try to put it inside a

$(document).ready(function(){
//place the above code here.
});

回答3:

Can't reproduce the problem with this self-contained example

<?php
if ( isset($_GET['user']) ) {
    echo '<span>user=', htmlspecialchars($_GET['user']), '</span>';
    die;
}
?>
<html>
    <head>
        <title>...</title>
        <style type="text/css">
            .stackwrapper { width:100px; height: 100px; margin: 5px;  background-color: red }
        </style>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                $('.stackwrapper').click(function(e) {
                    var id=$(this).attr('id');
                    $('.userdrawings').load('?user='+id).fadeIn("slow");
                });
            });
        </script>
    </head>
    <body>
        <div class="stackwrapper" id="user1"></div>
        <div class="stackwrapper" id="user2"></div>
        <div class="userdrawings"></div>
    </body>
</html>

You might want to use a javascript debugger, like e.g. included in firebug and check for errors.

回答4:

You could try putting it at the document level:

$(document).on('click', '.stackwrapper', function(e) {
    var id = $(this).attr('id');
    $('.userdrawings').load('loadSession.php?user=' + id).fadeIn("slow");
});

回答5:

It's strange , while It works well on my computer . It changes every time when I click. this is my code

html

<div class="stackwapper" id="user1">user1</div>
<div class="stackwapper" id="user2">user2</div>
<div class="userdrawings"></div>

$(document).ready(function(){
$(".stackwapper").click(function(e) {
       var id = $(this).attr('id');
       $(".userdrawings").load("user_session.php?user="+id).fadeIn("slow");
    });
});

user_session.php

$user=$_GET["user"];
echo "hello " . $user;

来源：https://stackoverflow.com/questions/9838132/jquery-load-function-only-gets-called-once

标签

jquery

load

click