Javascript 在“this”之后选择元素

我需要为一个函数同时选择多个元素。我有

jQuery

$('[class^="shapeLeft"]').click(function(){
  var $parent = $(this).parent()
  var $both   = $(this, 'this + div[class^="shapeRight"]')
  $both.css({'height': parent.height() + 20})
})

HTML

我说$this，'this+div[class^=shapeRight]的部分似乎不起作用。 单击的元素确实会更改其高度，但其以ShaperRight开头的类的直接邻居不会更改

如何同时选择单击的元素及其ShaperRight同级

谢谢

从这里开始，下面介绍如何查找与选择器匹配的所有同级：

var allSiblings = $(this).siblings("the-selector-here");

以下是如何找到以下所有兄弟姐妹：

var allSiblings = $(this).nextAll("the-selector-here");

以下是如何找到以下一个可能不相邻的兄弟姐妹：

var allSiblings = $(this).nextAll("the-selector-here").first();

更多

从你的小提琴上，我不知道你想要哪一个，但你说：

---

我想写一些东西来选择很多元素

…这让我觉得你想要下一个而不是第一个。然后是：

---

我需要同时选择这个和这个之后的元素

…这意味着您还需要。添加以下内容：

$.shapeLeftDiamond.clickfunction{ var parent=$this.parent； var thisShape=$this.nextAlldiv[class^='shapeRight'].addthis； thisShape.heightparent.height+20； } 主要{ 高度：200px； 宽度：200px； 背景色：F13； } shapeLeftDiamond先生{ 浮动：左； 宽度：80px； 高度：50px； 背景色：FF0； } .shapeRightDiamond{ 浮动：对； 宽度：80px； 高度：50px； 背景色：0FF； } 点击我 也应该增长 您需要将其从选择器中删除这在CSS选择器中没有任何意义，并更改参数的顺序。下面是上下文：

$(".shapeLeftDiamond").click(function(){
    var parent = $(this).parent();
    var thisShape = $("+ div[class^='shapeRight']", this);
    thisShape.height(parent.height() + 20);
});

编辑：如果希望两个元素都增长，请使用。添加：

如果正是下面的节点，则使用.next

var thisShape = $(this).next().addBack();

如果它们共享同一父级，但在DOM中它们之间可能有其他元素，则可以使用.sibbins

var thisShape = $(this).siblings('[class^="shapeRight"]').addBack();

在这两种情况下，您还需要在末尾添加.addBack，以将当前元素包括在您的案例中的选择中

在

线上演示：

$(this, "this + div[class^='shapeRight']");

指：

在this+div[class^='ShaperRight']的上下文中查找this元素。其中字符串中的第二个是元素，而不是对象

您希望使用$this.next.shapeRightDiamond或$this.sides.shapeRightDiamond来获取单击的元素旁边的元素。要将元素链接到同一集合，请使用或

或

---

为什么不能用next呢？可以用children吗？我想写一些东西来选择很多元素。使用next，我需要写很多次，这是不现实的删除你之前的问题，因为你不喜欢你得到的回答，然后又问了一个基本相同的问题，没有进一步解释为什么你不能使用。下一步……现在这应该得到否决票。@CBroe我改变了问题并添加了一个提琴，但现在只有第二个元素增长，而不是“this”，我需要同时选择这个和这个之后的元素。这仅选择后面的元素this@GustvandeWal：.addthis，我已经更新了答案。回顾这一令人毛骨悚然的第一个问题，我现在意识到你的答案是第一个正确完成我试图实现的目标的答案，所以我现在接受了它：

var thisShape = $(this).siblings('[class^="shapeRight"]').addBack();

$(this, "this + div[class^='shapeRight']");

var elems = $(this).add( $(this).next(".shapeRightDiamond") );

var elems = $(this).next(".shapeRightDiamond").addBack();