zoukankan      html  css  js  c++  java
  • 使用val()方法设置表单中的默认选中项

    有时候我们展示给用户的表单中的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>
    


  • 相关阅读:
    技术债务墙:一种让技术债务可见并可协商的方法
    墙裂推荐
    shell 脚本通过Webhook 发送消息到微信群
    关于中医的一段对话 [ZZ] -- 思维训练故事
    应用深度神经网络预测学生期末成绩
    Python中的模块引用机制
    批量修改含空格的文件名「Linux」
    Markdown数学公式语法
    批处理修改IP
    FTD团队目录
  • 原文地址:https://www.cnblogs.com/mfrbuaa/p/3789939.html
Copyright © 2011-2022 走看看