0

I have come across a problem when working with JSON and making structured content after that.

The thing is that the only HTML of a panel is this:

<div class="users">
            <center>loading</center>
            <script>update_users();</script>
        </div>

But after downloading the information with JSON it ends up with something like that:

<div class="users">
<p class="name">User1</p>
<div class="detailed">
    <span>Entry1: value1</span>
</div>
</div>

The thing is that, in my case for example, I want detailed to be toggle(); as display:none should be the default value but Jquery doesn't want to select that new content.

//does work
  $(".users").click(function(){
            $(".users .detailed").toggle();
        });

//doesn't work
    $(".users .name").click(function(){
            $(".users .detailed").toggle();
        });

How can I solve the problem that Jquery doesn't work to select new content inserted to the page?

4

5 回答 5

4

对于新内容，您需要事件委托

$(document).on('click',".users .name",function(){
     $(".users .detailed").toggle();
});
于 2013-07-24T11:41:30.887 回答
0 
$(".users .name").unbind();

解绑然后重新绑定

于 2013-07-24T11:46:19.443 回答
0

有.live()方法，读一些关于那个的东西。我可以建议你使用：

$.find(".users .name").click(function(){
            $(".users .detailed").toggle();
        });

或者您可以使用绑定某些功能.on("click", yourfunction);

于 2013-07-24T11:42:19.980 回答
0

利用on

$(document).on('click',".users .name",function(){
     $(".users .detailed").toggle();
});
于 2013-07-24T11:42:57.227 回答
0

因为您正在动态创建.name简单的段落.click()，所以它不起作用。你必须使用.on()方法

$(document.body).on('click', '.name' ,function(){
   $(".detailed").toggle();
});

从技术上讲，如果您有超过 1 个用户，那么上述方法将不起作用，因为它会切换所有具有.detailed类的元素，您应该尝试这个

$(document.body).on('click', '.name' ,function(){
   $(this).next().toggle();
});

例子

于 2013-07-24T11:44:55.980 回答