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实现的动态文字变化输出效果示例【附演示与demo源码下载】
Mar 24 jQuery
基于jQuery实现文字打印动态效果
Apr 21 jQuery
jQuery滑动到底部加载下一页数据的实例代码
May 22 jQuery
jQuery选择器之属性过滤选择器详解
Sep 28 jQuery
jQuery+datatables插件实现ajax加载数据与增删改查功能示例
Apr 17 jQuery
jQuery基于Ajax实现读取XML数据功能示例
May 31 jQuery
jQuery事件绑定和解绑、事件冒泡与阻止事件冒泡及弹出应用示例
May 13 jQuery
基于jQuery实现挂号平台首页源码
Jan 06 jQuery
jQuery 选择方法及$(this)用法实例分析
May 19 jQuery
深入分析jQuery.one() 函数
Jun 03 jQuery
jQuery实现简单飞机大战
Jul 05 jQuery
使用jQuery实现购物车
Oct 29 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下Memcached入门实例解析
2015/01/05 PHP
学习PHP Cookie处理函数
2016/08/09 PHP
php装饰者模式简单应用案例分析
2019/10/23 PHP
Laravel自动生成UUID,从建表到使用详解
2019/10/24 PHP
javascript 火狐(firefox)不显示本地图片问题解决
2008/07/05 Javascript
jquery 圆形旋转图片滚动切换效果
2011/01/19 Javascript
jquery创建一个ajax关键词数据搜索实现思路
2013/02/26 Javascript
利用jQuery简单实现产品展示图片左右滚动功能(示例代码)
2014/01/02 Javascript
12306验证码破解思路分享
2015/03/25 Javascript
jQuery实现简单隔行变色的方法
2016/02/20 Javascript
Bootstrap+jfinal实现省市级联下拉菜单
2016/05/30 Javascript
原生js实现可爱糖果数字时间特效
2016/12/30 Javascript
让div运动起来 js实现缓动效果
2017/07/06 Javascript
基于Vue实例生命周期(全面解析)
2017/08/16 Javascript
详解vue2.0监听属性的使用心得及搭配计算属性的使用
2018/07/18 Javascript
angularjs中判断ng-repeat是否迭代完的实例
2018/09/12 Javascript
Vue页面渲染中key的应用实例教程
2021/01/12 Vue.js
在Python中使用元类的教程
2015/04/28 Python
详解Python中heapq模块的用法
2016/06/28 Python
Python寻找两个有序数组的中位数实例详解
2018/12/05 Python
Django框架静态文件使用/中间件/禁用ip功能实例详解
2019/07/22 Python
如何基于python实现归一化处理
2020/01/20 Python
python应用Axes3D绘图(批量梯度下降算法)
2020/03/25 Python
python3 中时间戳、时间、日期的转换和加减操作
2020/07/14 Python
详解vscode实现远程linux服务器上Python开发
2020/11/10 Python
捷克鲜花配送:Florea.cz
2018/10/29 全球购物
寻找完美的房车租赁:RVShare
2019/02/23 全球购物
英国在线药房:Express Chemist
2019/03/28 全球购物
俄罗斯最大的隐形眼镜销售网站:Ochkov.Net
2021/02/07 全球购物
文明学生事迹材料
2014/01/29 职场文书
运动会横幅标语
2014/06/17 职场文书
年度考核表个人总结
2015/03/06 职场文书
餐饮店长岗位职责
2015/04/14 职场文书
浙江省杭州市平均工资标准是多少?
2019/07/09 职场文书
微软Win11有哪些隐藏功能? windows11多个功能汇总
2021/11/21 数码科技
mysql 体系结构和存储引擎介绍
2022/05/06 MySQL