有时候我们展示给用户的表单中的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. 国内物联网平台初探（八）：移动云OneNET

    国内物联网平台初探(八)——移动云OneNET 平台架构 数据模型 使用场景示意图 服务 IOT Paas 基础服务 为IoT开发者提供智能设备自助开发工具.后台技术支持服务,为您提供物联网专网.短彩 ...

  2. IE8下String的Trim()方法失效的解决方法

    String的Trim()方法失效,在ie8下是有这样的情况的,解决方法也很简单使用$.trim(str)即可,需要的朋友可以了解下 用jquery的trim()方法,$.trim(str)就可以了.

  3. IntelliJ IDEA 创建web项目后添加Java EE （Tomcat）的依赖包

    本文讲述的是IntelliJ IDEA 12版本 如果在编译器中创建一个web项目后,没有设置tomcat的依赖包,就不能成功的编译,会缺少javax.servlet.*等类. 添加的方法是: 打开p ...

  4. 使AspNetPager控件中文显示分页信息

    在日常的编程过程中,很多学员对于使AspNetPager控件中文显示分页信息不是很清楚,本文将由达内的老师为各位学员介绍一下使AspNetPager控件中文显示分页信息的内容. AspNetPager ...

  5. 【Xamarin开发 Android 系列 13】 应用打包部署

    原文:[Xamarin开发 Android 系列 13] 应用打包部署 开始倒叙咯................ 先更新大宝部署吧,这个章节比较的Easy,童鞋们不用费脑筋.点解?从界面上填写几个参 ...

  6. hadoop2.2编程：hadoop性能测试

    <hadoop the definitive way>(third version)中的Benchmarking a Hadoop Cluster Test Cases 的class在新的 ...

  7. asp.net Context.User.Identity.Name说明

    今天做了一个身份验证页面,基本实现功能,却不能显示当前用户姓名,自己MSDN半天一无所获,问题就在Context.User.Identity.Name:Context是HttpContext类,Use ...

  8. 如何当好党支部书记 z

    如何当好党支部书记 党支部书记是党支部一班人的“班长”,一个党支部是否具有坚强的战斗力,能否发挥好战斗堡垒作用,在很大程度上取决于是不是有一个得力的支部书记.在改 革开放,全面建设小康社会,构建社会主 ...

  9. 简单的API应用

    对于初学系统编程,了解下系统的API是必要的: 下面这个程序实现的是将自身程序复制到windows目录和系统目录: #include<stdio.h> #include<string ...

  10. HDU-2562 奇偶位互换

    http://acm.hdu.edu.cn/showproblem.php?pid=2562 奇偶位互换 Time Limit: 3000/1000 MS (Java/Others)    Memor ...