0

我的网页上有一个故事上传系统，该系统将故事上传到指定文件夹中，并从中列出其内容到网页。我拆分了文本，所以只显示了 300 个字符，当用户点击它时，其余的就会显示出来。

这一个列出它：

<?php foreach($dataArray as $data) { ?>
    <div class="visible">
        <?php echo $data[0] . "<br/><center><a href='#' class='story_show'>Teljes Történet</a></center>";  ?>
    </div>
    <div class="hidden">
        <?php echo $data[1]; ?>
    </div>
<?php } ?>

这是我的 jQuery：

$('.hidden').css('display', 'none');
$('.visible').click(function () {

    $('.hidden').css('display', 'inline');
});

该页面（tortenetek.php）通过 Ajax 加载到主页面（blog.php）。我像这样包含jQuery blog.php：

<link href='http://fonts.googleapis.com/css?family=Niconne&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
        <link rel="stylesheet" type="text/css" href="../css/stilus.css"/>
        <script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script>
        <script type="text/javascript" src="../js/tinybox.js"></script>
        <script type="text/javascript" src="../js/ajax.js"></script>
        <link href="../css/lightbox.css" rel="stylesheet" />
        <script src="../js/lightbox.js"></script>
                <script src="../js/story.js"></script>

Story.js是我正在使用的脚本文件。

4

1 回答 1

1

如果我正确理解了您的问题，那么您需要利用事件委托，通过将.click()调用更改为.on()调用，并传递与始终在 DOM 中的祖先元素匹配的选择器：

$('#someAncestor').on('click', '.visible', function(){
    $(this).next('.hidden').css('display', 'inline');
});

this请注意使用和的事件处理函数的变化.next()。当您单击任何元素时，您当前拥有的方式将显示所有 元素。.hidden .visible

#someAncestor必须是代码执行时存在于 DOM 中的元素。这是有效的，因为大多数 DOM 事件从它们起源的元素（目标）通过树冒泡。您可以在任何祖先元素中捕获该事件。

于 2012-07-04T10:33:56.100 回答