Select 侄女和换兄弟姐妹

Question

我有这个 bootstrap（最小化）代码。

<div id='DD_type' class="dropdown">
   <button class="btn" ></button>
   <span id='af'>Type</span>
   <ul class="dropdown-menu">
      <li> 
         I want this HTML(its more than text) in my button
      </li>
   </ul>
</div>

<div id='Another Dropdown' class="dropdown">
   <button class="btn" ></button>
   <span id='af'>Type</span>
   <ul class="dropdown-menu">
      <li> 
         I want this HTML(its more than text) in my button
      </li>
   </ul>
</div>

我想用 li 中的第一个元素填充按钮。我现在拥有的是静态解决方案。

$(function() {
   $('#DD_LayOut>button').html($('#DD_LayOut>ul>li').html())
}

但是我想要一个通用的解决方案。（是的，我做了一些搜索）。

我的根本不工作。

 $('.dropdown > button').html($(This).siblings('ul>li:first').html())

谁能帮我解决这个问题。

提前致谢！

Answer 1

要实现这一点，您可以为 html() 方法提供一个函数，因为该函数的范围将是 button 元素，您可以使用该元素遍历 DOM 来查找所需的 li，像这样：

$('.dropdown > button').html(function(i, h) {
    return $(this).siblings('.dropdown-menu').find('li:first').html();
});

Working example

Select 侄女和换兄弟姐妹

Select niece and change siblings

jquery

picker

jquery-selectors

dropdown