JQuery - Как воздействовать только на один узел в представлении drupal

Question

Когда я нажимаю узел в представлении Drupal, он переключает тело для каждого узла в моем представлении, а не только на узел, который я нажимаю. Как я могу получить jquery для переключения только узла, который я нажимаю? Вот мой код в голове моего шаблона узла (узел-type.tpl.php)

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

И код для тела быть переключено.

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

В настоящее время он переключает все DIV с классом «больше» в моей точки зрения, а не только в узле, который я щелкая. Как ограничить его только щелчком узла?

Мне также понравилось бы, если бы только тело было открыто одновременно. то есть; при щелчке по другому узлу тело предыдущего узла закрывается.

Я уверен, что это, вероятно, легко, но я просто не могу понять это ...

Answer 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 содержание с id и href, или некоторые 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(); 
}); 

Demo: http://jsfiddle.net/jtbowden/EfUxt/

Существуют библиотеки, которые помогают в таких ситуациях, таких как вкладки пользовательского интерфейса jQuery.

Answer 2

Возможно, вам нужны закладки jQuery UI http://jqueryui.com/demos/tabs/ или некоторые другие вкладки jQuery.