Jquery向上遍历而不是向下遍历

Question

我有一个引导下拉列表，我试图填充--我猜您会用值调用header，就像在常规html下拉列表中看到的那样。所以用户知道他们在菜单中选择了什么。

我的问题是，如果在一个页面上有多个下拉列表，jquery将同时针对它们，而不仅仅是我要从中选择的对象。通常，我会通过添加一个$(this).parent()来修复这个问题，但是html稍微复杂一些，我真的不想做一个.parent().parent().parent()链。

一定有更好的方法做这件事，我错过了，或只是简单的遗忘。

我的html看起来像

<p><label class="control-label" data-bind="html: label"></label></p>
<div class="dropdown" data-bind="cssProperties: properties, css: { hidden : EvalDisplay() == false }">
    <button class="btn btn-default dropdown-toggle col-md-12 dropBtn" type="button" id="dropdownMenu1" data-toggle="dropdown">
        <span class='pull-left'  data-bind="value: value,attr: { 'name' : id}"></span>
        <span class="caret pull-right"></span>
        <p class='clearfix'></p>
    </button>
    <ul class="dropdown-menu side-dropdown" role="menu">
        <!-- ko foreach: options -->
            <li role="presentation"><a role="menuitem" tabindex="-1" data-bind="html: Value"></a></li>
        <!-- /ko -->
    </ul>
    <p class='clearfix'></p>
</div>

我的jQuery看起来像这样

$(".dropdown-menu li a").click(function(){
    $(".dropBtn.btn:first-child").html('<span class="pull-left">'+$(this).text()+'</span><span class="caret pull-right"></span>');
    $(".dropBtn.btn:first-child").val($(this).text());
});

还有一个用来和http://jsfiddle.net/0p1Lhzq0/玩的小提琴

我也和parentsUtil()一起玩过，但这似乎不对。

任何帮助都是很棒的！

Answer 1

用这个：

$(".dropdown-menu li a").click(function(){
    $(this).closest('.dropdown').find('.btn:first-child').html('<span class="pull-left">'+$(this).text()+'</span><span class="caret pull-right"></span>').val($(this).text());
});

矫正小提琴