JS动态给select的option赋值的具体操作步骤如下:
1、首先我们打开JS软件,点击界面左上角file选项目录下的new选项,再选择java project 新建web项目操作。
2、操作上图后进入下图界面,输入项目名点击下一步直到完成。
3、建立完成后,项目结构如下图。
4、在超链接中设置调用函数用于更新option,代码如下图红框所选。
5、在change函数中获取seclect项,获取option的数量,遍历option获取选中的option更新选中项。
6、最后看一下运行的效果,此时我们可以动态输入数值给select的option赋值。
<select name="" id="selectid"></select>
<script type="text/javascript">
<!--
var selectid=document.getElementById("selectid")
selectid.options.length=0
selectid[0]=new Option("---- 设置显示0 ----",0)
selectid[1]=new Option("---- 设置显示1 ----",1)
selectid[2]=new Option("---- 设置显示2 ----",2)
//-->
</script>
<script type="text/javascript">$(function() {
// 为所有的 class="sec" 下的 select 绑定 onchange 事件
$(".sec select").change(function() {
// 当选择的时候,找到当前选中的 option
var option = $(this).find("option:selected")
// 获得 value 和 对应文本
var selv = option.val()
var selt = option.text()
// 然后找到 select 的父节点的第0个 span,把 selt 写入到 span 中
$(this).parent().find("span:eq(0)").html(selt)
})
// 初始化的时候,执行一次change方法
$(".sec select").change()
})
</script>