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解析获取JSON数据
Apr 08 jQuery
jQuery实现的弹幕效果完整实例
Sep 06 jQuery
JQuery用$.ajax或$.getJSON跨域获取JSON数据的实现代码
Sep 23 jQuery
jQuery解析json格式数据示例
Sep 01 jQuery
jQuery位置选择器用法实例分析
Jun 28 jQuery
jQuery提示框插件SweetAlert用法分析
Aug 05 jQuery
jquery获取input输入框中的值
Nov 13 jQuery
jquery实现两个div中的元素相互拖动的方法分析
Apr 05 jQuery
jquery检测上传文件大小示例
Apr 26 jQuery
jQuery开发仿QQ版音乐播放器
Jul 10 jQuery
jQuery实现二级导航菜单的示例
Sep 30 jQuery
jQuery实现查看图片功能
Dec 01 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
轻松修复Discuz!数据库
2008/05/03 PHP
PHP设计模式之适配器模式代码实例
2015/05/11 PHP
微信支付PHP SDK ―― 公众号支付代码详解
2016/09/13 PHP
Javascript 入门基础学习
2010/03/10 Javascript
document.getElementById介绍
2011/09/13 Javascript
Javascript selection的兼容性写法介绍
2013/12/20 Javascript
手机开发必备技巧:javascript及CSS功能代码分享
2015/05/25 Javascript
jquery实现可旋转可拖拽的文字效果代码
2016/01/27 Javascript
SWFUpload多文件上传及文件个数限制的方法
2016/05/31 Javascript
JS封装的选项卡TAB切换效果示例
2016/09/20 Javascript
Vue.js实现实例搜索应用功能详细代码
2017/08/24 Javascript
vue单个组件实现无限层级多选菜单功能
2018/04/10 Javascript
使用D3.js+Vue实现一个简单的柱形图
2018/08/05 Javascript
详解VUE项目中安装和使用vant组件
2019/04/28 Javascript
基于better-scroll 实现歌词联动功能的代码
2020/05/07 Javascript
javascript利用canvas实现鼠标拖拽功能
2020/07/23 Javascript
[01:54]胎教DOTA2 准妈妈玩家现身中国区预选赛
2016/06/26 DOTA
Django与遗留的数据库整合的方法指南
2015/07/24 Python
利用pandas将numpy数组导出生成excel的实例
2018/06/14 Python
python实现旋转和水平翻转的方法
2018/10/25 Python
Pandas GroupBy对象 索引与迭代方法
2018/11/16 Python
python矩阵的转置和逆转实例
2018/12/12 Python
Python学习笔记之读取文件、OS模块、异常处理、with as语法示例
2019/06/04 Python
Pandas_cum累积计算和rolling滚动计算的用法详解
2019/07/04 Python
python3.6编写的单元测试示例
2019/08/17 Python
详解opencv中画圆circle函数和椭圆ellipse函数
2019/12/27 Python
Python 中的pygame安装与配置教程详解
2020/02/10 Python
python实现飞船大战
2020/04/24 Python
详解基于 Canvas 手撸一个六边形能力图
2019/09/02 HTML / CSS
优秀的教师个人的中文求职信
2013/09/21 职场文书
教师师德教育的自我评价
2013/10/31 职场文书
计生办班子群众路线教育实践活动个人对照检查材料思想汇报
2014/10/04 职场文书
领导干部群众路线对照检查材料
2014/11/05 职场文书
计算机实训报告总结
2014/11/05 职场文书
超外差式晶体管收音机的组装与统调
2021/04/22 无线电
让文件路径提取变得更简单的Python Path库
2021/05/27 Python