0

我正在尝试执行以下操作：

<div class="messageNewComment">
<form style="margin:0px;" action="cible.php" method="post">

<textarea class="content"></textarea>
<div class="button_block">
<input type="submit" class="button" value=" Partager "/>
<input type="submit" class="cancel" value=" Annuler " />
</div>

</form>
</div>

当您专注于它时，textarea 会增长，并且 button_block 使用 jquery 显示。当我只有一个像上面这样的部分时它工作正常，但由于我将有多个评论区域，我希望正确的 button_block 出现......我怎样才能做到这一点？

这是我的jQuery代码：

$(function() 
{
$(".content").focus(function()
{
$(this).height("50px"); //animate({"height": "50px",}, "fast" );
if ($(this).height() == 50) {
$(".button_block").slideDown("fast");
}
return false;
});

$(".cancel").click(function()
{
/*if ($(".content").height() != 50) {*/
$(".content").height("20px"); //animate({"height": "20px",}, "fast" );
$(".button_block").slideUp("fast");
return false;
//}
});

截至目前，页面的每个 button_block 都会显示......所以它不是很方便;）

任何的想法 ？

非常感谢！

哥提耶！

4

4 回答 4

2

尝试更换

$(".button_block").slideDown("fast");

和

$(this).next(".button_block").slideDown("fast");

您的选择器将选择所有带有 class 的元素button_block，但我们需要的是紧跟在文本区域后面的按钮块。所以我们可以使用jquery next选择器。

同样的逻辑也应该用于向上滑动按钮。

$(this).parent(".button_block").slideUp("fast").prev(".content").height("20px");

这里我们可以使用parent和prev选择器

于 2010-12-23T07:57:54.073 回答
1

因为 div 是兄弟 .next 应该可以解决问题：

$(".content").focus(function()
{
$(this).height("50px"); //animate({"height": "50px",}, "fast" );
if ($(this).height() == 50) {
$(this).next(".button_block").slideDown("fast");
}
return false;
});
于 2010-12-23T07:54:24.827 回答
0

遍历树next()

$(".content").focus(function(){
    $(this).height(50).val('').next(".button_block").show();
  return false;
});
于 2010-12-23T07:58:47.213 回答
0

只要你的 div 就在 textarea 之后，keegan3d 的答案就是正确的。如果将来它们之间碰巧有任何其他元素，你可以使用这个：

$(function() 
{
$(".content").focus(function()
{
$(this).height("50px"); //animate({"height": "50px",}, "fast" );
if ($(this).height() == 50) {
$(this).nextAll(".button_block:first").slideDown("fast");
return false;
});
于 2010-12-23T08:00:18.110 回答