问问题
41868 次
6 回答
17
很多答案......这是另一种不使用 document.write 或 innerHTML 或 jQuery 的方法......
HTML
<select id="foo"></select>
JS
(function() { // don't leak
var elm = document.getElementById('foo'), // get the select
df = document.createDocumentFragment(); // create a document fragment to hold the options while we create them
for (var i = 1; i <= 42; i++) { // loop, i like 42.
var option = document.createElement('option'); // create the option element
option.value = i; // set the value property
option.appendChild(document.createTextNode("option #" + i)); // set the textContent in a safe way.
df.appendChild(option); // append the option to the document fragment
}
elm.appendChild(df); // append the document fragment to the DOM. this is the better way rather than setting innerHTML a bunch of times (or even once with a long string)
}());
这是一个Fiddle来演示它。
于 2012-10-04T19:39:33.837 回答
1
是的，例如，您可以在 html 正文标记中编写此代码
<select>
<script language="javascript" type="text/javascript">
for(var d=1;d<=31;d++)
{
document.write("<option>"+d+"</option>");
}
</script>
</select>
于 2012-10-04T10:43:43.520 回答
-1
也许你可以玩javascript和innerHTML。尝试这个
HTML
<body onload="selectFunction()">
<select id="selectId">
</select>
Javascript
function selectFunction(){
var x=0;
for(x=0;x<5;x++){
var option = "<option value='" + x + "'>Label " + x + "</option>"
document.getElementById('selectId').innerHTML += option;
}
}
于 2012-10-04T10:39:33.683 回答
-1
一种方法是使用 DynamicHTML。options让html页面有一个ofselect标签的占位符。
<select id="selectBox"></select>
在一个 js 文件中
var options = ["one","two","three"], selectHtml = "";
for(var optionIndex = 0; optionIndex < options.length; optionIndex++) {
selectHtml += ("<option>" + options[optionIndex] + "</option>");
}
document.getElementById("selectBox").innerHTML = selectHtml;
将上面的代码放在一个函数中并调用该函数onload。
于 2012-10-04T10:44:00.180 回答
-2
HTML 不是一种编程语言，只是一种标记语言，因此它不包括诸如 for 循环或 if 语句之类的东西。Javascript 确实如此。您可以使用 javascript 生成/操作 HTML，从而使用 for 循环在 <select> 中创建 <option> 标签。作为 javascript 的初创公司，请查看 w3schools.com
不过，我不喜欢使用纯 javascript，我宁愿选择像 jQuery 这样的 javascript 框架来执行此操作。使用 jquery 很容易使用 javascript 对 HTML dom 进行跨平台兼容操作。您只需要在 HTML 中包含一些额外的 javascript 文件即可使其正常工作。见http://jquery.com/
使用 jquery 的一个例子是这样的：
<select id='myselect'></select>
<script type='text/javascript'>
var values=[[1,'tree'],[2,'flower'],[3,'car']];
for(v in values){
var option=$('<option></option>');
option.attr('value',values[v][0]);
option.text(values[v][1]);
$('#myselect').append(option);
}
</script>
于 2012-10-04T10:50:57.453 回答
-2
不，您不能在 HTML 中使用 for 循环。HTML 是一种标记语言，不能使用逻辑代码。但是，您可以根据您的目标使用javascript来执行您的逻辑。
这是一个使用流行的 javascript 库 jQuery 的示例：
for(i=0; i<5; i++){
$("select").append("<option>" + i + "</option>");
}
见例子：http: //jsfiddle.net/T4UXw/
于 2012-10-04T10:40:12.980 回答