Question

我正在为wordpress创建自己的小部件。我有以下代码：

jQuery("body").on("change", "select[id=elementselect]", function(){  
    var val = jQuery(this).val();
    jQuery('#element1,element2').hide().filter('#element'+val).fadeIn('slow')
})

代码效果很好，但如果用户在侧边栏中有两个或更多小部件，则会影响所有小部件。由于它们基于类我不能给小部件中的元素赋予唯一的名称。那么，是否有可能只针对与我当前正在使用的“select”元素共享同一父节点的元素？

HTML看起来像这样（简化）：

<form>
  <fieldset>
    <select id="elementselect">
      <option value="1"></option>
      <option value="2"></option>
    </select>
  </fieldset>

  <fieldset id="element1"></fieldset>

  <fieldset id="element2"></fieldset>
</form>

还是有另一种解决方案吗？

编辑：我现在修好了。刚刚将id更改为类并使用了.closest（）

谢谢大家

Answer 1

不完全确定你的问题是什么，但为了得到一个元素兄弟姐妹，你可以这样做：

var $siblings = $('#childElement').siblings();

http://api.jquery.com/siblings/

Answer 2

也许这会有所帮助......

这是一个JS Fiddle示例，展示了jQuery方法parent()，children()和siblings()如何处理事件：http://jsfiddle.net/phillipkregg/GWCyL/

代码很简单：

$("#parent_div p").on("click", function() {
    console.log($(this).parent().children().siblings())

});

单击div中的段落元素会转到其父级 - div - 然后查找其子级--p标记 - 然后记录段落标记的兄弟。

如何仅针对具有相同父级的元素

2 个答案: