Question

说明：

我有一个PHP代码，可以加载个人资料中的所有用户帖子。现在每个帖子中都有一个div，其中包含一个＆＃34; new_text_post＆＃34;

我想要的是什么：

我想要的是当所有帖子在页面上加载时使用＆＃34; new_text_post＆＃34;应该隐藏类，以后稍微淡化切换（这是完美的工作）。我不知道如何加载那个隐藏的div，当我点击它时它应该是fadetoggle。

我尝试了什么

1）我试图设置它的css属性visibility:hidden，但它完全隐藏它，即使在淡入淡出切换时也从未显示它

2）我使用过jquery

$(document).ready(function(){

$(".new_text_post").hide();

});

但即使这样也不起作用......我以前经历过这个但是我不记得我是如何解决它的

这就是我如何加载用户帖子

<?php 
while ($t = mysql_fetch_array($result))
{
   echo '<div class = "new_text_post">'.$t['post'].'<div>';
}

 ?>

..任何人??

Answer 1

这一切都取决于你如何加载动态内容。

在任何情况下，您都应该隐藏内容后加载内容，并在页面加载时隐藏不。

如果您使用ajax，则需要将其隐藏在同一个done函数中：

done: function(){
    //...
    //add elements here
    //...

    //and then hide them
    $(".new_text_post").hide();
},

如果你使用jQuery ajax扩展.load()，那么你需要等到加载完成：

.load(/*...load here...*/).promise().done(function(){
    $(".new_text_post").hide();
});

在任何情况下，您都需要将它们隐藏在添加它们的相同位置。

<强>更新

在加载帖子后立即添加一个脚本块，然后执行jquery：

<?php 
    while ($t = mysql_fetch_array($result))
    {
       echo '<div class = "new_text_post">'.$t['post'].'<div>';
    }
    //after adding all the posts, insert a script block with the hiding jQuery:
    echo "<script> $('.new_text_post').hide(); </script>"
?>

Answer 2

我不知道我的问题是否正确，但你的意思是这样吗？ http://jsfiddle.net/5ahckn7t/

显示带有用户信息的div，但默认情况下隐藏new_text_post。

<div class="userpost">
    This is a div with userpost

    <div class="new_text_post">
        This is a div which is not always shown
    </div>
</div>

和JQuery：

$(document).ready(function(){
  $(".new_text_post").hide();
});


$('.userpost').on('click', function(){
   $('.new_text_post').show();
});

<强>更新

嗯，我仍然觉得我没有把问题说得对，但也许这就是你的想法：

http://jsfiddle.net/5ahckn7t/1/

<div class="userpost">
    This is a div with userpost
</div>
<div class="new_text_post">
    This is a div which is not always shown
</div>
<div class="userpost">
    This is a div with userpost
</div>
<div class="new_text_post">
    This is a div which is not always shown
</div>
<div class="userpost">
    This is a div with userpost
</div>
<div class="new_text_post">
    This is a div which is not always shown
</div>

<button id="togglePost">Toggle new_text_post</button>

JQuery的：

$(document).ready(function(){
  $(".new_text_post").hide();
});


$('#togglePost').on('click', function(){
   $('.new_text_post').show();
});

Answer 3

使用父选择器

$(document).ready(function(){
    $("body .new_text_post").hide();
});

在动态加载的html上应用jquery

3 个答案: