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 remove()过滤被删除的元素(推荐)
Jul 18 jQuery
利用jQuery异步上传文件的插件用法详解
Jul 19 jQuery
jquery实现下拉菜单的手风琴效果
Jul 23 jQuery
详解jquery插件jquery.viewport.js学习使用方法
Sep 08 jQuery
jQuery实现文件编码成base64并通过AJAX上传的方法
Apr 12 jQuery
jQuery实现仿京东防抖动菜单效果示例
Jul 06 jQuery
jQuery的ztree仿windows文件新建和拖拽功能的实现代码
Dec 05 jQuery
在Vue项目中引入JQuery-ui插件的讲解
Jan 27 jQuery
Vue项目中使用jquery的简单方法
May 16 jQuery
详解webpack引用jquery(第三方模块)的三种办法
Aug 21 jQuery
jQuery高级编程之js对象、json与ajax用法实例分析
Nov 01 jQuery
Jquery Fade用法详解
Nov 06 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中取得image按钮传递的name值
2006/10/09 PHP
PHP4在Windows2000下的安装
2006/10/09 PHP
使用PHP实现密保卡功能实现代码&amp;lt;打包下载直接运行&amp;gt;
2011/10/09 PHP
php中用于检测一个地理IP地址是否可用的代码
2012/02/19 PHP
php返回json数据函数实例
2014/10/09 PHP
php去除html标记的原生函数详解
2015/01/27 PHP
PHP合并discuz用户脚本的方法
2015/08/04 PHP
Javascript this关键字使用分析
2008/10/21 Javascript
jquery autocomplete自动完成插件的的使用方法
2010/08/07 Javascript
jquery如何获取复选框的值
2013/12/12 Javascript
vue中计算属性(computed)、methods和watched之间的区别
2017/07/27 Javascript
原生JS实现ajax与ajax的跨域请求实例
2017/12/01 Javascript
Vue组件库发布到npm详解
2018/02/17 Javascript
nodejs require js文件入口,在package.json中指定默认入口main方法
2018/10/10 NodeJs
layui的布局和表格的渲染以及动态生成表格的方法
2019/09/18 Javascript
javascript随机变色实例代码
2019/10/15 Javascript
基于ant design日期控件使用_仅月份的操作
2020/10/27 Javascript
详解实现vue的数据响应式原理
2021/01/20 Vue.js
[57:16]2014 DOTA2华西杯精英邀请赛 5 25 LGD VS VG第二场
2014/05/26 DOTA
[34:27]DOTA2上海特级锦标赛B组败者赛 VG VS Spirit第一局
2016/02/26 DOTA
简述Python中的面向对象编程的概念
2015/04/27 Python
浅析Python pandas模块输出每行中间省略号问题
2018/07/03 Python
opencv python 图像去噪的实现方法
2018/08/31 Python
python多线程同步实例教程
2019/08/11 Python
Python安装tar.gz格式文件方法详解
2020/01/19 Python
图解CSS3制作圆环形进度条的实例教程
2016/05/26 HTML / CSS
AmazeUI 评论列表的实现示例
2020/08/13 HTML / CSS
Holland & Barrett爱尔兰:英国领先的健康零售商
2019/03/31 全球购物
寒假思想汇报
2014/01/10 职场文书
学校安全工作制度
2014/01/19 职场文书
英语一分钟演讲稿
2014/04/29 职场文书
环境保护与污染治理求职信
2014/07/16 职场文书
党的群众路线教育实践活动查摆剖析材料
2014/10/10 职场文书
2015年行政工作总结范文
2015/04/09 职场文书
送给自己的励志语句:要安静的优秀,悄无声息的坚强
2019/11/26 职场文书
Go gorilla/sessions库安装使用
2022/08/14 Golang