亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

你好,請問使用js給select插入option ?

你好,請問使用js給select插入option ?

滄海一幻覺 2021-08-12 20:11:04
我要做一個注冊頁面,有三個分別是年(1890年開始)、月、日的select生日選擇,怎么用js添加?
查看完整描述

2 回答

?
互換的青春

TA貢獻1797條經驗 獲得超6個贊

按下列排版輸入下列代碼:

if (data) {

var jsonObject = eval(data.Table);
var selectSecond = $("#SelectSecond");
selectSecond.empty();
for (var i = 0; i < jsonObject.length; i++) {
var Opt = new Option();
//var Opt = document.createElement("option");

Opt.value = jsonObject[i].numbers;
Opt.Text = jsonObject[i].notects;
selectSecond.options.add(Opt);
}

在前端
<select id="SelectSecond" onchange="selected()">
</select>
但是樣沒有反應,下拉框是空白的。jsonObject確實是有值的。

更多0

關于 select 的添加 option 應該注意的問題。 
標準的做法如上
也就是說,標準的做法是 s.options.add();
但是如果你一定要用 s.appendChild(option);
注意了,你只能用如下兩種方式之一:
1.
s.appendChild(option);
option.text = 'hello world';
option.value =3;
也就是,一定要先添加到 select 中,然后再為 option 賦值。否則在 FF 下是顯示正常的,但是在 IE6 中顯示的是空白

2. 如果你要講 option.text 和 option.value 的賦值放在前面,那么請用 option.innerHTML 而不是 option.text
如下:
option.innerHTML = 'hello world';
opion.value = 3;
option.appendChild(option);
3 第三種解決方式。
var op=document.createElement("option");      // 新建OPTION (op) 
op.setAttribute("value",0);          // 設置OPTION的 VALUE 
op.appendChild(document.createTextNode("請選擇---")); // 設置OPTION的 TEXT
select.appendChild(op);           // 為SELECT 新建一 OPTION(op)

select.options.length=0;           //把select對象的所有option清除掉

select.options.remove(i);           //把select對象的第i個option清除掉


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JS動態添加刪除option</title>
<script>
//動態刪除select中的所有options:
function delAllOptions(){
document.getElementById("user_dm").options.length=0;
}
//動態刪除select中的某一項option:
function delOneOption(indx){
document.getElementById("user_dm").options.remove(indx);
}

// 動態添加select中的項option:
function addOneOption(){
//document.getElementById("user_dm").options.add(new Option(2,"mytest"));

var selectObj=document.getElementById("user_dm");
alert(selectObj.length);
selectObj.options[selectObj.length] = new Option("mytest", "2");
}
</script>
</head>
<body>
<select id="user_dm" name="user_dm">
<option value="0" selecte>==請選擇人員==</option>
<option value="1">test</option>
</select><br>
<input type="button" onClick="addOneOption()" value="添加">
<input type="button" onClick="delOneOption(1)" value="刪除第一個">
<input type="button" onClick="delAllOptions()" value="清空">
</body>
</html>

===============================================================================

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>Js動態添加與刪除Option對象</TITLE>

<script language="JavaScript">

// 添加選項

function addOption(pos){

var objSelect=document.getElementById("mySelect");

// 取得字段值

//var strName = document.myForm.myOptionName.value;

// var strValue = document.myForm.myOptionValue.value;

// 建立Option對象

var objOption = new Option("李高灰","bbbbbbbbb");

if (pos == -1&& pos > objSelect.options.length))

objSelect.options[objSelect.options.length] = objOption;

else

objSelect.add(objOption, pos);

}



// 刪除

function deleteOption(type){

var objSelect=document.getElementById("mySelect");

if (type == true)

objSelect.options[objSelect.selectedIndex] = null;

else

objSelect.remove(objSelect.selectedIndex);

}

// 顯示選項信息

function showOption(){

var objSelect=document.getElementById("mySelect");

var name = objSelect.options[objSelect.selectedIndex].text;

var value = objSelect.options[objSelect.selectedIndex].value;

alert(name + " = " + value);

}


//動態刪除select中的所有options:

function clearAllOptions(){

var objSelect=document.getElementById("mySelect");

objSelect.options.length=0;

}

</script>



查看完整回答
反對 回復 2021-08-16
?
守候你守候我

TA貢獻1802條經驗 獲得超10個贊

<select id="Mmonth">
<option>1</option>
</select>
<input type="button" onclick="a()" value="添加"/>
<script>
function a(){
document.getElementById("Mmonth").options.add(new Option(1, 1));
}

</script>



查看完整回答
反對 回復 2021-08-16
  • 2 回答
  • 0 關注
  • 297 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號