获取下拉框选中的label

最新推荐文章于 2023-03-12 16:16:18 发布

最新推荐文章于 2023-03-12 16:16:18 发布 · 1.5k 阅读

文章标签：

#下拉框 #select #下拉框选中的文本

javascript 专栏收录该内容

140 篇文章

订阅专栏

本文介绍了一种JavaScript方法来获取HTML下拉框中选中项的文本内容，而不是其值。此方法适用于不同浏览器环境，并展示了如何在实际应用中调用此方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1,如何获取下拉框选中的文本(不是值)呢?

var selectedIndex = $houseBuilding.get(0).selectedIndex;
var selectedOption = $houseBuilding.get(0).options[selectedIndex];
var selectHouse = selectedOption.label;
if (!selectHouse) {
    selectHouse = selectedOption.text;
}

抽取为一个js方法:

/**
 * select component
 */
com.whuang.hsj.getSelectedOptionLabel = function(selectObj) {
	if (typeof selectObj == 'string') {
		selectObj = com.whuang.hsj.$$one(selectObj);
		if(selectObj==null ||selectObj==undefined){
			selectObj=com.whuang.hsj.$$id(selectObj);
		}
	}
	var selectedIndex = selectObj.selectedIndex;
	if (selectedIndex >= 0) {// omit the first option
		var selectOption = selectObj.options[selectedIndex];
		/*if ("textContent" in selectOption) {// textContent is specific to
			// Internet explorer and firefox has
			// no this attribute
			return selectOption.textContent;
		} else {
			return selectOption.label;
		}*/
		return selectOption.textContent || selectOption.label || selectedOption.text;

	} else {
		return "";
	}

};

2,应用

 if (data.result == 1) {
                toast_hwShortCenter("投票成功");
            } else if (data.result == 2) {
                toast_hwShortCenter("您还没有登录");
                window.user = null;
                window.sessionId = null;
            } else if (data.result == 3) {
                toast_hwShortCenter("您已经投票过");
               
                alert('目前 "' + com.whuang.hsj.getSelectedOptionLabel($houseBuilding.get(0)) + '" 总投票数为:' + data.voteCount);
            } else {
                toast_hwShortCenter('未知错误');
            }