標籤:ext 設定 log html ons 移除 選擇 nbsp val
下拉框
<select id="selectID">
<option vlaue="1">1</option>
<option vlaue="2">2</option>
<option vlaue="3">3</option>
</select>
jq針對下拉框的基本操作有
//選擇變更事件
$("#selectID").change(function(){ selectChangeFunCode; });
//擷取屬性值
//擷取下拉框選中項的text屬性值
var selectText = $("#selectID").find("option:selected").text();
console.log(selectText);
//擷取下拉框選中項的value屬性值 ①
var selectValue = $("#selectID").val();
console.log(selectValue);
//擷取下拉框選中項的index屬性值
var selectIndex = $("#selectID").get(0).selectedIndex;
console.log(selectIndex);
////擷取下拉框最大的index屬性值
var selectMaxIndex = $("#selectID option:last").attr("index");
console.log(selectMaxIndex);
//擷取文本值
//擷取下拉框選中項的 常值內容 ②
var selectHtml = $("#selectID").find("option:selected").html();
console.log(selectHtml );
要更改 下拉框其中一個option,需要同時操作①②
//設定下拉框index屬性為5的選項 選中
$("#selectID").get(0).selectedIndex = 5;
//設定下拉框value屬性為4的選項 選中
$("#selectID").val(4);
//設定下拉框text屬性為5的選項 選中
$("#selectID option[text=5]").attr("selected", "selected"); $("#yyt option:contains(‘5‘)").attr("selected", true);
//在下拉框最後添加一個選項
$("#selectID").append("<option value=‘7‘>7</option>");
//在下拉框最前添加一個選項
$("#selectID").prepend("<option value=‘0‘>0</option>")
//移除下拉框最後一個選項
$("#selectID option:last").remove();
//移除下拉框 index屬性為1的選項
$("#selectID option[index=1]").remove();
//移除下拉框 value屬性為4的選項
$("#selectID option[value=4]").remove();
//移除下拉框 text屬性為5的選項
$("#selectID option[text=5]").remove();
【jq】JQuery對select option的操作