Javascript 如何找到最近的跨度？

假设我有一个空闲的html结构-

<div data-theme="a" class="ui-btn ui-btn-icon-right ui-btn-corner-all ui-shadow ui-btn-up-a">
    <span class="ui-btn-inner ui-btn-corner-all">
        <span class="ui-btn-text">Select One</span>
        <span class="ui-icon ui-icon-arrow-d ui-icon-shadow">
        </span>
    </span>
    <select onchange="selectState(this,'ADDR_SHIP_STATE')" id="ADDR_SHIP_STATE" name="ADDR_SHIP_STATE"> 
        <option>Hi</option>
        <option>Hello</option>
        <option>How</option>
        <option>are</option>
        <option>you</option>
    </select>   
</div>  

请建议我怎么做。

.closest（）

将向上进入DOM，但不会像

.parents（）

那样向下移动（顺便说一句，您没有为类搜索添加

（点），但这可能是一个打字错误）

下面是一个尝试：

$(id).parent().find(".ui-btn-text").text(selectedState);

试一试-

这将-

查找“select”元素的父级“div”

使用

find

获取父div中包含的

.ui btn text

元素

---

演示-

如果您使用jQuery，那么使用像onchange这样的属性并不是真正不引人注目的方式。这样更好：

$('#ADDR_SHIP_STATE').change(function() {
    $(this).prev().find('.ui-btn-text').text($(this).val());
});

---

请参见此示例：jsfiddle.net/8htta/5（顺便说一句，ipr101发布了相同的代码…）-请注意，我在创建jsfiddle时更正了我的代码，因为您的

ui btn文本

要低2级，所以我必须使用

find

而不是

子项

（后者只向下移动一级）

function selectState(id, stateId) {
    var selectedState = $("#" + stateId + " option:selected").val();
    $(id).parents('div').find(".ui-btn-text").text(selectedState);
}

$('#ADDR_SHIP_STATE').change(function() {
    $(this).prev().find('.ui-btn-text').text($(this).val());
});