zero 换个问法吧,我就想知道如何用js增加或者删除select的option。ext以后再学了。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Untitled Document</title> </head> <script language="JavaScript"> var listData = [["aaaaa", 0], ["bbbbb", 1], ["ccccc", 0], ["ddddd", 0], ["eeeee", 0], ["fffff", 0], ["ggggg", 0]]; function makeList(){ var strHtml = ""; strHtml = "<select id='sel'>"; for (var i = 0; i < listData.length; i++) { strHtml += "<option value='" + listData[i][0] + "'"; if (listData[i][1] == 1) { strHtml += " selected"; } strHtml += ">" + listData[i][0] + "</option>"; } strHtml += "</select>"; document.getElementById("div1").innerHTML = strHtml; } </script> <body> <input type="button" value="test" onclick="makeList();"> <br> <div id="div1"> </div> </body> </html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Untitled Document</title> </head> <script language="JavaScript"> var listData = [["aaaaa", 0], ["bbbbb", 1], ["ccccc", 0], ["ddddd", 0], ["eeeee", 0], ["fffff", 0], ["ggggg", 0]]; function makeList(){ var strHtml = ""; strHtml = "<select id='sel'>"; for (var i = 0; i < listData.length; i++) { strHtml += "<option value='" + listData[i][0] + "'"; if (listData[i][1] == 1) { strHtml += " selected"; } strHtml += ">" + listData[i][0] + "</option>"; } strHtml += "</select>"; document.getElementById("div1").innerHTML = strHtml; }
function addOption(){ var n = document.createElement("option"); n.value = "xxxxx"; n.innerHTML = "xxxx"; document.getElementById("sel").appendChild(n); }
function delOption(){ var osel = document.getElementById("sel"); osel.remove(osel.selectedIndex);
var s = document.createElement("select"); var o = document.createElement("option"); o.value = 'xx'; op.innerHTML = 'yy'; s.appendChild(o); 最后生成的下拉框如下: <select> <option value='xx'>yy</option> </select>
支持! 建议楼主看一下 DOM 操作,做 Web 如果不懂 js ,会很吃力,很不方便的。祝楼主成功。
给你个例子!你自己去看看吧
js很菜啊。
换个问法吧,我就想知道如何用js增加或者删除select的option。ext以后再学了。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>
<script language="JavaScript">
var listData = [["aaaaa", 0], ["bbbbb", 1], ["ccccc", 0], ["ddddd", 0], ["eeeee", 0], ["fffff", 0], ["ggggg", 0]];
function makeList(){
var strHtml = "";
strHtml = "<select id='sel'>";
for (var i = 0; i < listData.length; i++) {
strHtml += "<option value='" + listData[i][0] + "'";
if (listData[i][1] == 1) {
strHtml += " selected";
}
strHtml += ">" + listData[i][0] + "</option>";
}
strHtml += "</select>";
document.getElementById("div1").innerHTML = strHtml;
}
</script>
<body>
<input type="button" value="test" onclick="makeList();">
<br>
<div id="div1">
</div>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>
<script language="JavaScript">
var listData = [["aaaaa", 0], ["bbbbb", 1], ["ccccc", 0], ["ddddd", 0], ["eeeee", 0], ["fffff", 0], ["ggggg", 0]];
function makeList(){
var strHtml = "";
strHtml = "<select id='sel'>";
for (var i = 0; i < listData.length; i++) {
strHtml += "<option value='" + listData[i][0] + "'";
if (listData[i][1] == 1) {
strHtml += " selected";
}
strHtml += ">" + listData[i][0] + "</option>";
}
strHtml += "</select>";
document.getElementById("div1").innerHTML = strHtml;
}
function addOption(){
var n = document.createElement("option");
n.value = "xxxxx";
n.innerHTML = "xxxx";
document.getElementById("sel").appendChild(n);
}
function delOption(){
var osel = document.getElementById("sel");
osel.remove(osel.selectedIndex);
}
</script>
<body>
<input type="button" value="test" onclick="makeList();"><input type="button" value="add" onclick="addOption();"><input type="button" value="del" onclick="delOption();">
<br>
<div id="div1">
</div>
</body>
</html>
var o = document.createElement("option");
o.value = 'xx'; op.innerHTML = 'yy'; s.appendChild(o);
最后生成的下拉框如下:
<select>
<option value='xx'>yy</option>
</select>
支持!
建议楼主看一下 DOM 操作,做 Web 如果不懂 js ,会很吃力,很不方便的。祝楼主成功。
<head>
<title>JS实例</title>
<script language=javascript>
function showDiv(){
if(div1.style.display=="none")
{
div1.style.display="";
}
else
{
div1.style.display="none";
}
}
function isSelected(value){
var cityName;
var city = document.getElementById("select");
//获取选中的城市名称
for(i=0;i<city.length;i++){ if(city[i].selected==true){ cityName = city[i].innerText; //关键点 //alert("cityName:" + cityName);
}
}
document.getElementById("text").value = cityName;
div1.style.display="none";
}
</script>
</head>
<body>
<input type="text" id="text"></input>
<input type="button" name="button" value="选择" onClick="javascript:showDiv();"></input>
<div id="div1" style="display:none;">
<select id="select" onchange="isSelected(this.value);">
<option value="0">请选择</option>
<option value="1">上海市</option>
<option value="2">北京市</option>
<option value="3">重庆市</option>
<option value="4">南京市</option>
</select>
</div>
</body>
</html>
一个简单的DEMO,建议楼主可以去看看