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

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

一般我们使用select标签时大概都会使用到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;
}

酱紫就能取到了~

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

php 修改select标签,JS修改input,textarea,select标签的可读可写属性
通过JS修改input,textarea,select标签的可读可写属性首先,控制input,与textarea只读属性是 readonly 在js中可以这样去改变,这里要注意js中O要大写 re ...
select html默认选中的值,HTML/jquery中的select标签设置默认选中取值
一.jQuery中的select标签设置默认选中取值每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如 1.设置value为pxx的项选中 $(" ...
html中select标签默认选择,HTML中的select标签如何设置默认选中的选项
方法有两种. 第一种通过的属性来设置选中项,此方法可以在动态语言如php在后台根据需要控制输出结果. 1 2 3 4 5 1 option > 2 option > 3 option &g ...
uni中使用select标签后生成APP页面跳转空白
uni中使用select标签后生成APP页面跳转空白最近再用webstrom时,写uni APP时发现一个问题当生成apk后,带有select选择器标签的页面突然无法显示一片空白. 报错显示:Ca ...
Vue中select下拉框的默认选中项的三种情况
在Vue中使用select下拉框主要靠的是 v-model 来绑定选项 option 的 value 值. select下拉框在界面的展示,我们都希望看到框中有一个值而不是空白,比如显示 &qu ...
vue.js 默认选中select_vue select二级联动第二级默认选中第一个option值的实例
当二级联动比如选择国家的时候,希望选中一个国家的时候后面城市默认选中第一个城市,则给国家的select加一个@change事件就可以了所在区域 {{item.country}} {{item}} d ...
修改select 标签中的值
背景: 前台下拉列表中的值需要与input标签中输入的值相等思路: 1.下拉列表为空时,input标签有值的情况下复制给select标签 2.后台只需要一直读取select标签的值即可,不需要再重复 ...
php导航默认选中,html中关于select标签如何设置默认选中的选项详解
方法有两种. 第一种通过的属性来设置选中项,此方法可以在动态语言如php在后台根据需要控制输出结果.< select id = "sel" > < option ...
html select样式修改,select标签的默认样式修改
在项目中,用到select标签,需要对select标签自定义样式. 在chrome浏览器中会对select有一个默认的border-radius,并且无法去掉. 可以通过下面的方法来解决: 1.需要通 ...

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

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

最新文章

热门文章