jQuery表单设置值的方法


Posted in jQuery onJune 30, 2017

本文实例为大家分享了jQuery如何表单设置值的具体代码,供大家参考,具体内容如下

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script src="js/jquery-1.11.3.min.js"></script>
  <script>
    $(function () {
      $("input[type=button]:eq(0)").click(function () {
        $("#single").val("选择2号");
      });
      $("input[type=button]:eq(1)").click(function () {
        $("#multiple").val(["选择2号","选择3号"]);
      })
      $("input[type=button]:eq(2)").click(function () {
        $(":checkbox").val(["check2","check3"]);//等同于$("input[type=checkbox]").filter(":eq(0),:eq(1)").attr("checked","checked")
        $(":radio").val(["radio3"]);//等同于$("input[type=radio]").attr("checked","checked"),虽然是单选框,取值还是得用数组
      });
    });
  </script>
</head>
<body>
<input type="button" value="设置单选下拉框选中"/>
<input type="button" value="设置多选下拉框选中"/>
<input type="button" value="设置单选框和多选框选中"/>

<br/><br/>

<select id="single">
  <option>选择1号</option>
  <option>选择2号</option>
  <option>选择3号</option>
</select>

<select id="multiple" multiple="multiple" style="height:120px;">
  <option selected="selected">选择1号</option>
  <option>选择2号</option>
  <option>选择3号</option>
  <option>选择4号</option>
  <option selected="selected">选择5号</option>
</select>

<br/><br/>


<input type="checkbox" value="check1"/> 多选1
<input type="checkbox" value="check2"/> 多选2
<input type="checkbox" value="check3"/> 多选3
<input type="checkbox" value="check4"/> 多选4

<br/>

<input type="radio" value="radio1"/> 单选1
<input type="radio" value="radio2"/> 单选2
<input type="radio" value="radio3"/> 单选3
</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jquery实现图片上传前本地预览
Apr 28 jQuery
jquery网页加载进度条的实现
Jun 01 jQuery
jQuery实现的简单图片轮播效果完整示例
Feb 08 jQuery
[原创]jquery判断元素内容是否为空的方法
May 04 jQuery
jQuery实现百度图片移入移出内容提示框上下左右移动的效果
Jun 05 jQuery
jQuery md5加密插件jQuery.md5.js用法示例
Aug 24 jQuery
jQuery实现根据身份证号获取生日、年龄、性别等信息的方法
Jan 09 jQuery
jquery.tagsinput.js实现记录checkbox勾选的顺序
Sep 21 jQuery
jQuery实现弹幕特效
Nov 29 jQuery
jQuery操作元素追加内容示例
Jan 10 jQuery
jquery向后台提交数组的代码分析
Feb 20 jQuery
jquery实现直播视频弹幕效果
Feb 25 jQuery
jQuery开源组件BootstrapValidator使用详解
Jun 29 #jQuery
Vue.js列表渲染绑定jQuery插件的正确姿势
Jun 29 #jQuery
基于jQuery实现的Ajax 验证用户名唯一性实例代码
Jun 28 #jQuery
jQuery、layer实现弹出层的打开、关闭功能
Jun 28 #jQuery
各种选择框jQuery的选中方法(实例讲解)
Jun 27 #jQuery
基于jQuery封装的分页组件
Jun 26 #jQuery
jQuery.Form实现Ajax上传文件同时设置headers的方法
Jun 26 #jQuery
You might like
造就帕卡马拉的帕卡斯是怎么被发现的
2021/03/03 咖啡文化
PHP4引用文件语句的对比
2006/10/09 PHP
PHP中的gzcompress、gzdeflate、gzencode函数详解
2014/07/29 PHP
php正则表达式验证(邮件地址、Url地址、电话号码、邮政编码)
2016/03/14 PHP
thinkPHP框架可添加js事件的分页类customPage.class.php完整实例
2017/03/16 PHP
Laravel框架Auth用户认证操作实例分析
2019/09/29 PHP
PHP使用gearman进行异步的邮件或短信发送操作详解
2020/02/27 PHP
jquery事件机制扩展插件 jquery鼠标右键事件
2011/12/21 Javascript
php与js的区别是什么
2013/08/05 Javascript
JS简单操作select和dropdownlist实例
2014/11/26 Javascript
基于jquery实现最简单的选项卡切换效果
2016/05/08 Javascript
picLazyLoad 实现图片延时加载(包含背景图片)
2016/07/21 Javascript
详谈js模块化规范
2017/07/07 Javascript
ReactNative实现Toast的示例
2017/12/31 Javascript
Ant design vue中的联动选择取消操作
2020/10/31 Javascript
node中短信api实现验证码登录的示例代码
2021/01/20 Javascript
[01:03:36]DOTA2-DPC中国联赛 正赛 VG vs Magma BO3 第二场 1月26日
2021/03/11 DOTA
Python运用于数据分析的简单教程
2015/03/27 Python
Python检测网站链接是否已存在
2016/04/07 Python
Python基于sftp及rsa密匙实现远程拷贝文件的方法
2016/09/21 Python
Python实现识别手写数字 Python图片读入与处理
2020/03/23 Python
python使用turtle库绘制时钟
2020/03/25 Python
Python global全局变量函数详解
2018/09/18 Python
python实现给scatter设置颜色渐变条colorbar的方法
2018/12/13 Python
Python通过队列来实现进程间通信的示例
2020/10/14 Python
Html5中localStorage存储JSON数据并读取JSON数据的实现方法
2017/02/13 HTML / CSS
全球知名鞋履品牌授权零售商:Journeys
2016/09/17 全球购物
联想哥伦比亚网上商城:Lenovo Colombia
2017/01/10 全球购物
理肤泉美国官网:La Roche-Posay
2018/01/17 全球购物
益模软件Java笔试题
2012/03/27 面试题
企业面试题试卷附带答案
2015/12/20 面试题
销售经理工作职责范文
2013/12/03 职场文书
科研课题实施方案
2014/03/18 职场文书
幼儿园中班上学期评语
2014/04/18 职场文书
Grafana可视化监控系统结合SpringBoot使用
2022/04/19 Redis
vscode远程免密登入Linux服务器的配置方法
2022/06/28 Servers