动态设置select控件的默认值的JS代码，请指正 - JavaScript论坛

已结贴√ 问题点数：20 回复次数：9

动态设置select控件的默认值的JS代码，请指正

页面中有一个select控件，通过选定不同的值显示不同的内容，显示页面是同一个。

目前的情况是：在选定一个项目后，页面重新显示，但select中显示的仍是第一项（默认值），不是刚刚选中的那个项。

现在要实现的功能是，在页面重新显示后，select控件中显示刚刚选择的项目。
页面select控件代码如下：

程序代码：

<select name="jumpMenu" id="jumpMenu" onChange="jumpMenu('parent',this,0)">
   <option id="1" value="跳转URL">111</option>  //  111 是显示给用户的信息
   <option id="2" value="跳转URL">111</option>
   <option id="3" value="跳转URL">111</option>
   <option id="4" value="跳转URL">111</option>
   <option id="5" value="跳转URL">111</option>
</select>

为此，我写了下面的JS代码：

程序代码：

function display(optionID)
{
   var all_options = document.getElementById("jumpMenu").options;
   for (i=0; i<all_options.length; i++)
   {
      if (all_options[i].id == optionID)  // 根据option标签的ID来进行判断  测试的代码这里是两个等号
      {
         all_options[i].selected = true;
      }
   }
}

调用方式如下：

<script type="text/javascript">
   var the_id = '${option_id}';      // option_id 是后台传回的option标签的ID值。
   window.onload = display(the_id);
</script>

但是，在测试时查看select的option，没有任何一个option被设置了selected属性。
请问上面的JS代码有什么问题，请指教！

[ 本帖最后由无缘今生于 2010-11-15 11:13 编辑 ]

搜索更多相关主题的帖子: 控件　代码　 select　动态　

第 2 楼

得分:0

all_options[i].id == optionID

第 3 楼

得分:0

以下是引用aspic在2010-11-15 11:08:29的发言：

all_options.id == optionID

不好意思，我在抄代码的时候写错了，
我原来是这样写的。

all_options.id == optionID

经测试，是下面这句没执行，

var all_options = document.getElementById("jumpMenu").options;

请问这条语句有什么问题，我看不出来。

[ 本帖最后由无缘今生于 2010-11-15 11:21 编辑 ]

时不再来!!!

第 4 楼

得分:8

程序代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. xmlns="http://www. http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<select name="jumpMenu" id="jumpMenu" onChange="jumpMenu('parent',this,0)">
   <option id="1" value="跳转URL">111</option>  //  111 是显示给用户的信息
   <option id="2" value="跳转URL">222</option>
   <option id="3" value="跳转URL">333</option>
   <option id="4" value="跳转URL">444</option>
   <option id="5" value="跳转URL">555</option>
</select>
<script type="text/javascript">
function display(optionID){
   var all_options = document.getElementById("jumpMenu").options;
   for (i=0; i<all_options.length; i++){
      if (all_options[i].id == optionID)  // 根据option标签的ID来进行判断  测试的代码这里是两个等号
      {
         all_options[i].selected = true;
      }
   }
};
display("4");
</script>
</body>
</html>

第 5 楼

得分:0

不过id不应该用数字开头的吧。。。。

第 6 楼

得分:12

看表演罗。。。
<select name="jumpMenu" id="jumpMenu" onChange="jumpMenu('parent',this,0)">
   <option id="sel_1" value="跳转URL">111</option>  //  111 是显示给用户的信息
   <option id="sel_2" value="跳转URL">111</option>
   <option id="sel_3" value="跳转URL">111</option>
   <option id="sel_4" value="跳转URL">111</option>
   <option id="sel_5" value="跳转URL">111</option>
</select>

------------------------------------
function display(optionID)
{
   var all_options = document.getElementById("jumpMenu").options;
   for (i=0; i<all_options.length; i++)
   {
      if (all_options[i].id.split('_')[1] == optionID)  // 根据option标签的ID来进行判断  测试的代码这里是两个等号
      {
         all_options[i].selected = true;
      }
   }
}

--------------------
window.onload=function(){display(the_id)}

世事如潮我如水，只叹江湖几人回。