Jquery - 如何在drupal视图中只影响一个节点

时间:2012-04-11 23:52:19

标签: javascript jquery drupal views

当我在drupal视图中单击一个节点时,它会切换视图中每个节点的正文,而不仅仅是我点击的节点。如何让jquery切换我点击的节点?这是我的节点模板头部的代码(node-type.tpl.php)

 <script>
 $("button").click(function () {
 $(".more").toggle();
 });
 </script>

要切换身体的代码。

 <div class="more"><?php print $node->content['body']['#value']; ?></div>

目前,它会在课程中切换每个div&#34;更多&#34;在我的整个视图中而不是仅在我单击的节点中。如何将其限制为仅单击节点?

如果只有身体一次打开,我也会喜欢它。即;当单击一个不同的节点时,前一个节点的主体切换为关闭。

我确定它可能很容易,但我似乎无法弄明白......

2 个答案:

答案 0 :(得分:1)

相对于.more的按钮在哪里?

如果按钮位于.more元素中,您需要执行以下操作:

$("button").click(function () {
    $('.more').hide();
    $(this).closest(".more").show();
});

如果按钮不是.more的父级或祖先,您需要再做一点。如果按钮的顺序与.more元素的顺序相同(并且没有任何不相关的按钮),则可以执行以下操作:

$("button").click(function () {
    $('.more').hide();
    $('.more').eq( $('button').index( $(this) ) ).show();
});

但是,最好将按钮与.more内容与idhref或某些jQuery数据相关联:

<button class='morebutton' data-more="#more1">Button 1</button>
<button class='morebutton' data-more="#more2">Button 2</button>
<div class='more' id="more1">More Number 1</div>
<div class='more' id="more2">More Number 2</div>

脚本:

$(".morebutton").click(function () {
    $('.more').hide();
    $( $(this).data('more') ).show();
});

演示:http://jsfiddle.net/jtbowden/EfUxt/

有些库可以帮助解决这些问题,比如jQuery UI Tabs。

答案 1 :(得分:0)

您可能需要jQuery UI标签http://jqueryui.com/demos/tabs/或其他一些jQuery标签解决方案。