jquery获取form表单input元素值的简单实例


Posted in Javascript onMay 30, 2016

一般取值方法

$("#id").val();

$("#id").attr("value"); 

//其中value是元素的属性名如<s:textfield  id="cifName" key="cifName"   name="#request.consBean.cifName" />的id,key,name属性。取到的值是属性后对应双引号里面的字符。

function saveConsumerValidate(){
     var cifNo =$("#cifNo").val(); //jquery获取文本框值方法1
     var cardType = $("#cardType").attr("value"); //jquery获取文本框值方法2
     var cardNo = document.getElementById("cardNo").value;//DOM获取值方法

val(),val(val)方法atttr(name),atttr(key,value)方法和value属性

在用$("#id")来获得页面的input元素的时候,发现$("#id").value不能取到值

$("#intro")是一个jquery的选择器结果是id="intro" 的第一个元素,而不是HTML DOM getElementById() 方法的document.getElement

value是HTML DOM Text对象的一个属性,设置或返回文本域的 value 属性的值。

val()是jquery的获得或设置元素的 DOM 属性的操作方法。

val()方法:获得第一个匹配元素的当前值

取值:$("#id").val();|$("element元素").val();/下同 

或者

$("#id")[0].value;

 

HTML 代码:
<input type="text" value="some text"/>
jQuery 代码:
$("input").val();

 val(val)方法:设置每一个匹配元素的值。

赋值:$("#id").val("new value");

 

或者

$("#id")[0].value = "new value";

HTML 代码:
<input type="text"/>
jQuery 代码:
$("input").val("hello world!");

attr(name)方法:取得第一个匹配元素的属性值。通过这个方法可以方便地从第一个匹配元素中获取一个属性的值。如果元素没有相应属性,则返回 undefined 。

取值:$("#id").attr("value");

HTML 代码:
<img src="test.jpg"/>
jQuery 代码:
$("img").attr("src");
结果:
test.jpg

attr(key,value)方法:为所有匹配的元素设置一个属性值。

赋值:$("#id").attr(attribute,value);

描述:
为所有图像设置src属性。

HTML 代码:
<img/> 
<img/>
jQuery 代码:
$("img").attr("src","test.jpg");
结果:
[ <img src= "test.jpg" /> , <img src= "test.jpg" /> ]

以上这篇jquery获取form表单input元素值的简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery插件制作 手风琴Panel效果实现
Aug 17 Javascript
使用Java实现简单的server/client回显功能的方法介绍
May 03 Javascript
jquery给图片添加鼠标经过时的边框效果
Nov 12 Javascript
JavaScript日期时间与时间戳的转换函数分享
Jan 31 Javascript
javascript随机显示背景图片的方法
Jun 18 Javascript
JavaScript图片轮播代码分享
Jul 31 Javascript
vue.js利用defineProperty实现数据的双向绑定
Apr 28 Javascript
JavaScript实现多重继承的方法分析
Jan 09 Javascript
JavaScript面试出现频繁的一些易错点整理
Mar 29 Javascript
express默认日志组件morgan的方法
Apr 05 Javascript
JavaScript格式化json和xml的方法示例
Jan 22 Javascript
vue项目中使用scss的方法步骤
May 16 Javascript
实用又漂亮的BootstrapValidator表单验证插件
May 30 #Javascript
使用JQuery 加载页面时调用JS的实现方法
May 30 #Javascript
Bootstrap开关(switch)控件学习笔记分享
May 30 #Javascript
jquery获取复选框checkbox的值实现方法
May 30 #Javascript
JS在onclientclick里如何控制onclick的执行
May 30 #Javascript
JS获取复选框的值,并传递到后台的实现方法
May 30 #Javascript
值得分享的轻量级Bootstrap Table表格插件
May 30 #Javascript
You might like
通过PHP修改Linux或Unix口令的方法分享
2012/01/30 PHP
php+mysqli事务控制实现银行转账实例
2015/01/29 PHP
CI配置多数据库访问的方法
2016/03/28 PHP
php 删除指定文件夹的实例讲解
2017/07/25 PHP
Javascript 陷阱 window全局对象
2008/11/26 Javascript
javascript oop开发滑动(slide)菜单控件
2010/08/25 Javascript
js验证输入是否为手机号码或电话号码示例
2013/12/30 Javascript
Node.js实现简单聊天服务器
2014/06/20 Javascript
Javascript Object 对象学习笔记
2014/12/17 Javascript
javascript实现详细时间提醒信息效果的方法
2015/03/11 Javascript
JavaScript实现为input与textarea自定义hover,focus效果的方法
2015/08/21 Javascript
JavaScript中关联原型链属性特性
2016/02/13 Javascript
使用Bootstrap框架制作查询页面的界面实例代码
2016/05/27 Javascript
domReady的实现案例
2016/11/23 Javascript
PHP获取当前页面完整URL的方法
2016/12/02 Javascript
详解JavaScript常量定义
2017/01/03 Javascript
纯js实现动态时间显示
2020/09/07 Javascript
详解js正则表达式验证时间格式xxxx-xx-xx形式
2018/02/09 Javascript
JavaScript实现图片的放大缩小及拖拽功能示例
2019/05/14 Javascript
layui 上传文件_批量导入数据UI的方法
2019/09/23 Javascript
layui(1.0.9)文件上传upload,前后端的实例代码
2019/09/26 Javascript
python检测远程端口是否打开的方法
2015/03/14 Python
python中base64加密解密方法实例分析
2015/05/16 Python
Python依赖包整体迁移方法详解
2019/08/15 Python
python目标检测给图画框,bbox画到图上并保存案例
2020/03/10 Python
如何在mac下配置python虚拟环境
2020/07/06 Python
美国独家设计师眼镜在线光学商店:Glasses Gallery
2017/12/28 全球购物
新加坡最早生产电动滑板车的制造商之一:FunsToTheFore
2020/09/08 全球购物
一套软件测试笔试题
2014/07/25 面试题
大专毕业生简历的自我评价
2013/10/20 职场文书
优秀应届毕业生自荐信
2013/11/16 职场文书
2014广电局实施党的群众路线教育实践活动方案思想汇报
2014/09/22 职场文书
2014大学生党员评议个人总结
2014/09/22 职场文书
党的群众路线教育实践活动学习笔记
2014/11/05 职场文书
行政诉讼答辩状
2015/05/21 职场文书
MySQL 8.0 之不可见列的基本操作
2021/05/20 MySQL