有关在html中修改select标签的option selected默认选中属性实现

着急想要解决办法的朋友可以直接看最后的内容：}

一般我们使用select标签时大概都会使用到option标签来填充下拉框中的内容

只有几个固定的内容写死在页面还好，可能是这样的：

<select name="type"type="text">
                                    <option velue= "">type</option>
                                    <option value="1">type1</option>
                                    <option value="2">type2</option>
                                    <option value="3">type3</option>
                                    <option value="4">type4</option>
                                    <option value="5">type5</option>

                                </select>

或者动态的从ajax返回值的方式去控制option的各种值，但支持动态取值的功能只有在jsp页面才会用到，那不是本篇博客的主题，所以就先不谈了（其实就是偷懒…………）

那么如果你既需要动态的获取又需要下拉框怎么办？

一开始可能会觉得select实现不了这样的功能，因为select不能通过表达式去控制velue的值。而input倒是可以控制，但value的值会直接显示出来。这可能让你头疼致死

select标签的效果这样说可能不太好理解

代码：

酱紫写的结果：

取值并没有发生任何改变，咱们再开控制台看看：

有没有怀疑人生？

这是为什么呢？脑海里各种黑人问号………………

通过表达式去修改也不行，比如这种：

$('#type').selected(true);

或者这种：

$('#type').selected(selected);

图我就不贴了，太占地方。大家只要知道实现不了就行了…………不过看到这篇博客的你很有可能已经试过了

那么问题来了，怎么样才能再html中自由自在的修改select标签默认的option选中内容呢？原理大家基本都懂，我就直接上代码了：

html:

<select id="type" name="type"type="text" >
    <option id ="type1"value="1">1</option>
    <option id ="type2" value="2">2</option>
    <option id ="type3" value="3">3</option>
    <option id ="type4" value="4">4</option>
    <option id ="type5" value="5">5</option>
</select>
    <input type="hidden" id="typev" value="$!{list.type}"/>

javascript:

//控制轮播类型的初始选中值
str = document.getElementById("typev").value;
obj = document.getElementById("type");
for(i=0;i<obj.length;i++){
    if(obj[i].value==str)
        obj[i].selected = true;
}

酱紫就能取到了~