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插件Carousel实现轮播广告效果
Mar 27 jQuery
jQuery实现点击关注和取消功能
Jul 03 jQuery
jQuery使用zTree插件实现可拖拽的树示例
Sep 23 jQuery
javascript+jQuery实现360开机时间显示效果
Nov 03 jQuery
jQuery实现鼠标响应式透明度渐变动画效果示例
Feb 13 jQuery
jQuery插件jsonview展示json数据
May 26 jQuery
jquery获取select选中值的文本,并赋值给另一个输入框的方法
Aug 21 jQuery
jQuery+css last-child实现选择最后一个子元素操作示例
Dec 10 jQuery
如何使用CSS3+JQuery实现悬浮墙式菜单
Jun 18 jQuery
jquery检测上传文件大小示例
Apr 26 jQuery
jQuery实现简单全选框
Sep 13 jQuery
jquery实现加载更多&quot;转圈圈&quot;效果(示例代码)
Nov 09 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使用socket发送HTTP请求的方法
2016/02/14 PHP
thinkphp表单上传文件并将文件路径保存到数据库中
2016/07/28 PHP
PHP检查网站是否宕机的方法示例
2017/07/24 PHP
postman的安装与使用方法(模拟Get和Post请求)
2018/08/06 PHP
php进程(线程)通信基础之System V共享内存简单实例分析
2019/11/09 PHP
Javascript 面向对象(一)(共有方法,私有方法,特权方法)
2012/05/23 Javascript
jquery获取table中的某行全部td的内容方法
2013/03/08 Javascript
jquery实现隐藏与显示动画效果/输入框字符动态递减/导航按钮切换
2013/07/01 Javascript
JS中表单的使用小结
2014/01/11 Javascript
红米手机抢购的js代码
2014/03/10 Javascript
当jquery ajax遇上401请求的解决方法
2016/05/19 Javascript
require、backbone等重构手机图片查看器
2016/11/17 Javascript
微信公众平台开发教程(六)获取个性二维码的实例
2016/12/02 Javascript
jQuery实现字符串全部替换的方法
2016/12/12 Javascript
纯JS实现简单的日历
2017/06/26 Javascript
vue element table 表格请求后台排序的方法
2018/09/28 Javascript
微信小程序之事件交互操作实例分析
2018/12/03 Javascript
[06:48]DOTA2-DPC中国联赛2月26日Recap集锦
2021/03/11 DOTA
python中enumerate函数用法实例分析
2015/05/20 Python
Python批量创建迅雷任务及创建多个文件
2016/02/13 Python
Python正则抓取网易新闻的方法示例
2017/04/21 Python
详谈在flask中使用jsonify和json.dumps的区别
2018/03/26 Python
在scrapy中使用phantomJS实现异步爬取的方法
2018/12/17 Python
Python使用QQ邮箱发送邮件实例与QQ邮箱设置详解
2020/02/18 Python
Django单元测试中Fixtures的使用方法
2020/02/26 Python
python批量检查两个对应的txt文件的行数是否一致的实例代码
2020/10/31 Python
用css3制作纸张效果(外翻卷角)
2013/02/01 HTML / CSS
纯CSS3发光分享按钮的实现教程
2014/09/06 HTML / CSS
Kent & Curwen:与大卫·贝克汉姆合作
2017/06/13 全球购物
BabyBjörn婴儿背带法国官网:BabyBjorn法国
2018/06/16 全球购物
德国前卫设计师时装在线商店:Luxury Loft
2019/11/04 全球购物
应届生煤化工求职信
2013/10/21 职场文书
班长岗位职责
2013/11/10 职场文书
人力资源管理专业应届生求职信
2014/04/24 职场文书
2015年学习部工作总结范文
2015/03/31 职场文书
css让页脚保持在底部位置的四种方案
2022/07/23 HTML / CSS