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 ajaxupload插件实现无刷新上传文件
Apr 23 jQuery
jQuery查找dom的几种方法效率详解
May 17 jQuery
各种选择框jQuery的选中方法(实例讲解)
Jun 27 jQuery
jQuery Layer弹出层传值到父页面的实现代码
Aug 17 jQuery
基于jquery实现五星好评
Nov 18 jQuery
jquery-file-upload 文件上传带进度条效果
Nov 21 jQuery
jQuery简单判断值是否存在于数组中的方法示例
Apr 17 jQuery
JQueryDOM之样式操作
Mar 27 jQuery
jQuery - AJAX load() 实例用法详解
Aug 27 jQuery
jQuery实现数字华容道小游戏(实例代码)
Jan 16 jQuery
jquery实现烟花效果(面向对象)
Mar 10 jQuery
jQuery 淡入/淡出效果函数用法分析
May 19 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
example2.php
2006/10/09 PHP
php 随机数的产生、页面跳转、件读写、文件重命名、switch语句
2009/08/07 PHP
PHP 日期加减的类,很不错
2009/10/10 PHP
php序列化函数serialize() 和 unserialize() 与原生函数对比
2015/05/08 PHP
PHP常用的类封装小结【4个工具类】
2019/06/28 PHP
Laravel框架集合用法实例浅析
2020/05/14 PHP
PHP网页缓存技术优点及代码实例
2020/07/29 PHP
JS实现打开本地文件或文件夹
2021/03/09 Javascript
解放web程序员的输入验证
2006/10/06 Javascript
Ajax,UTF-8还是GB2312 eval 还是execScript
2008/11/13 Javascript
判断window.onload是否多次使用的方法
2014/09/21 Javascript
浅谈JS之tagNaem和nodeName
2016/09/13 Javascript
原生js实现秒表计时器功能
2017/02/16 Javascript
js统计页面上每个标签的数量实例代码
2018/05/29 Javascript
Vue实现商品分类菜单数量提示功能
2019/07/26 Javascript
vue实现二级导航栏效果
2019/10/19 Javascript
Node.js中文件系统fs模块的使用及常用接口
2020/03/06 Javascript
[16:21]教你分分钟做大人:圣堂刺客
2014/12/03 DOTA
[02:17]2016完美“圣”典风云人物:Sccc专访
2016/12/03 DOTA
Python实现的多线程端口扫描工具分享
2015/01/21 Python
在Python中利用Pandas库处理大数据的简单介绍
2015/04/07 Python
python复制与引用用法分析
2015/04/08 Python
Python多进程并发与多线程并发编程实例总结
2018/02/08 Python
Python 字符串与数字输出方法
2018/07/16 Python
python命名空间(namespace)简单介绍
2019/08/10 Python
python离线安装外部依赖包的实现
2020/02/13 Python
20行Python代码实现一款永久免费PDF编辑工具的实现
2020/08/27 Python
python判断all函数输出结果是否为true的方法
2020/12/03 Python
Pycharm 跳转回之前所在页面的操作
2021/02/05 Python
土木工程应届生自荐信
2013/09/24 职场文书
清洁工表扬信
2014/01/08 职场文书
市场营销工作计划书
2014/05/06 职场文书
教师创先争优承诺书
2015/04/27 职场文书
cf战队宣传语
2015/07/13 职场文书
python 如何在 Matplotlib 中绘制垂直线
2021/04/02 Python
前端实现滑动按钮AJAX与后端交互的示例代码
2022/02/24 Javascript