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 相关文章推荐
bootstrap+jQuery实现的动态进度条功能示例
May 25 jQuery
jQuery 添加样式属性的优先级别方法(推荐)
Jun 08 jQuery
jquery版轮播图效果和extend扩展
Jul 18 jQuery
js案例之鼠标跟随jquery版(实例讲解)
Jul 21 jQuery
jQuery使用zTree插件实现可拖拽的树示例
Sep 23 jQuery
实现jquery放大镜的两种方法
Feb 22 jQuery
jQuery 导航自动跟随滚动的实现代码
May 30 jQuery
jQuery实现获取动态添加的标签对象示例
Jun 28 jQuery
jQuery时间戳和日期相互转换操作示例
Dec 07 jQuery
JavaScript表格隔行变色和Tab标签页特效示例【附jQuery版】
Jul 11 jQuery
jquery分页优化操作实例分析
Aug 23 jQuery
Jquery异步上传文件代码实例
Nov 13 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
php将fileterms函数返回的结果变成可读的形式
2011/04/21 PHP
使ecshop模板中可引用常量的实现方法
2011/06/02 PHP
zend framework配置操作数据库实例分析
2012/12/06 PHP
php中生成随机密码的自定义函数代码
2013/10/21 PHP
php之Smarty模板使用方法示例详解
2014/07/08 PHP
PHP内核学习教程之php opcode内核实现
2016/01/27 PHP
mac下多个php版本快速切换的方法
2016/10/09 PHP
JQuery CSS样式控制 学习笔记
2009/07/23 Javascript
jQuery入门第一课 jQuery选择符
2010/03/14 Javascript
JavaScript性能陷阱小结(附实例说明)
2010/12/28 Javascript
js单独获取一个checkbox看其是否被选中
2014/09/22 Javascript
jQuery模拟新浪微博首页滚动效果的方法
2015/03/11 Javascript
微信小程序购物商城系统开发系列-目录结构介绍
2016/11/21 Javascript
Bootstrap table使用方法详细介绍
2016/12/09 Javascript
原生JS实现《别踩白块》游戏(兼容IE)
2017/02/20 Javascript
通过构造函数实例化对象的方法
2017/06/28 Javascript
在vue-cli脚手架中配置一个vue-router前端路由
2017/07/03 Javascript
Vue文件配置全局变量的实例
2018/09/06 Javascript
小程序rich-text组件如何改变内部img图片样式的方法
2019/05/22 Javascript
gearman的安装启动及python API使用实例
2014/07/08 Python
python实现斐波那契递归函数的方法
2014/09/08 Python
Python二分法搜索算法实例分析
2015/05/11 Python
基于 Django 的手机管理系统实现过程详解
2019/08/16 Python
pytorch numpy list类型之间的相互转换实例
2019/08/18 Python
python绘制随机网络图形示例
2019/11/21 Python
如何使用scrapy中的ItemLoader提取数据
2020/09/30 Python
纯css3实现照片墙效果
2014/12/26 HTML / CSS
类、抽象类、接口的差异
2016/06/13 面试题
门卫班长岗位职责
2013/12/15 职场文书
音乐器材管理制度
2014/01/31 职场文书
学生自我评价范文
2014/02/02 职场文书
做一个有道德的人演讲稿
2014/05/14 职场文书
社区好人好事材料
2014/12/26 职场文书
关于清明节的演讲稿2015
2015/03/18 职场文书
解决sql server 数据库,sa用户被锁定的问题
2021/06/11 SQL Server
hive数据仓库新增字段方法
2022/06/25 数据库