有时候我们展示给用户的表单中的checkbox，radio，selec等标签的一些项是默认选中的。比方：当用户改动文章的时候，假设相应的栏目为下拉框的话，那么它的默认选中值应该是原来的栏目位置。

能够使用jquery中的val()方法给select、checkbox、radio设置默认选中项。

对于multiple类型的select和checkbox还能够设置多个默认值。

效果图：

方法：

	$("select#multiple").val(["选择2号","选择4号"]);

完整代码：

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>jquery test</title>

<script src="jquery-1.11.1.min.js"></script>

<style type="text/css">

	div

	{

		margin-top:50px;

		margin-left:100px;

	}

</style>

</head>

<body>

<div>

<select id="single">

	<option value="选择1号">选择1号</option>

	<option value="选择2号">选择2号</option>

	<option value="选择3号">选择3号</option>

	<option value="选择4号">选择4号</option>

</select>

</div>

<div>

<select id="multiple" multiple="multiple" style="height:120px;">

	<option value="选择1号">选择1号</option>

	<option value="选择2号">选择2号</option>

	<option value="选择3号">选择3号</option>

	<option value="选择4号">选择4号</option>

</select>

</div>

<div>

<input type="checkbox" value="check1"/>多选1

<input type="checkbox" value="check2"/>多选2

<input type="checkbox" value="check3"/>多选3

<input type="checkbox" value="check4"/>多选4

</div>

<div>

<input type="radio" value="radio1">单选1

<input type="radio" value="radio2">单选2

<input type="radio" value="radio3">单选3

<input type="radio" value="radio4">单选4

</div>

</body>

<script type="text/javascript">

	$("select#single").val(["选择4号"]);

	$("select#multiple").val(["选择2号","选择4号"]);

	$(":checkbox").val(["check1","check3"]);

	$(":radio").val(["radio4"]);

</script>

</html>

使用val()方法设置表单中的默认选中项的更多相关文章

  1. angularjs ng-select ng-options 默认选中项.

    <!DOCTYPE html> <html ng-app="myApp"> <head> <meta charset="utf- ...

  2. Android RadioGroup设置默认选中项

    今天有人问.Android 里面 RadioGroup里面有两个RadioButton怎么设置默认值? 第一个RadioButton设置 android:checked="true" ...

  3. php处理表单中的复选框问题以及js实现全选

    做的一个项目中遇到了全选和取消全选的问题,这是一个很普遍的功能,,虽然我们经常用到,但是真正做起来却发现行不通,在网上找了些,大部分都是ie,但是谷歌内核浏览器不能正常实现,所以经过小小的调整,今天就 ...

  4. Jquery 根据value值设置下拉列表（select）默认选中项

    方法一: $("#selIndustyType option[value='1']").attr("selected", "selected" ...

  5. jstree前端设置默认选中项

    $("#jstree").on("loaded.jstree", function (event, data) { var currDeptId = crm.g ...

  6. laravel中select2多选，初始化默认选中项

    项目中有发送消息功能,需要能通过搜索,多选用户,来指定发送人.使用 select2 插件来完成. select2 的 html 代码如下: <div class="form-group ...

  7. @Html.DropDownListFor默认选中项

    http://q.cnblogs.com/q/73902/ 项目使用mvc4,给dropDownList指定默认值未选中 页面代码是: 1.未有默认选中值 Html.DropDownListFor(m ...

  8. html <select> 用JS控制默认选中项

    <html> <head> <!--禁止页面缓存--><meta http-equiv="content-type" content=&q ...

  9. easyui combobox默认选中项

    今天写前端代码发现combobox还挺难搞, $("#select_Dic").combobox({                        url: "http: ...

随机推荐

  1. 我用C#调用C编译的dll中有这样一个函数,函数大概的功能就是把数据保存到buf缓冲区中：

    我用C#调用C编译的dll中有这样一个函数,函数大概的功能就是把数据保存到buf缓冲区中: C/C++ code   ? 1 int retrieve(int scanno,void* buf); 在 ...

  2. C++ QT中的QSound使用方法

    在pro文件中添加 QT += multimedia 就可以了

  3. JS实现精确加减乘除

    说明:项目中要使用 JS 实现自动计算的功能,进行一些浮点数运算时,计算结果却是一长串的值,这里提供一个解决方法,问题基本上可以解决. 具体代码如下: //加法函数 function accAdd(a ...

  4. 成都OpenPart——DevOps专场活动参与感

    今天下午去参加了成都OpenPart——DevOps专场,感觉很好. 题外话: 回想一下,工作将近四年了,这是第一次参加类似的活动.自从结婚带了小孩以后,就基本上每个周末奔波工作和家里两个城市之间,这 ...

  5. CSS3 @keyframes 语法

    http://www.w3chtml.com/css3/rules/@keyframes.html <!DOCTYPE html><html lang="zh-cn&quo ...

  6. Li Fei-fei写给她学生的一封信，如何做好研究以及写好PAPER

    Li Fei-fei写给她学生的一封信,如何做好研究以及写好PAPER 在微博上看到的,读完还是有些收获的,首先是端正做research的态度. 我是从这里看到的:http://www.vjianke ...

  7. 导入旧版本Android项目时的“Unable to resolve target ‘android

    在Ecplise + ATD + Android SDK的开发中,导入旧版本的Android项目时,往往会出现类似的如下错误 Error:Unable to resolve target 'andro ...

  8. Qt浅谈之三十九圆形进度条（已经有50篇了）

    http://blog.csdn.net/taiyang1987912/article/category/2314763

  9. 【HDOJ】3234 Exclusive-OR

    并查集.对于对元素赋值操作,更改为I p n v.令val[n]=0(任何数与0异或仍为原值).考虑fa[x] = fx, fa[y] = fy.如果使得fa[fx] = fy, 那么val[fx] ...

  10. 【HDOJ】3726 Graph and Queries

    Treap的基础题目,Treap是个挺不错的数据结构. /* */ #include <iostream> #include <string> #include <map ...