从重置input file标签中看jQuery的 .val() 和 .attr(“value”) 区别


Posted in Javascript onJune 12, 2016

背景:

在清空input file标签选中值时,分别用了以下方法,发现有的对有的错:

【√】$("#file")[0].value = "";
【√】$("#file")[0].value = null;

【×】$("#file").attr("value","");
【×】$("#file").attr("value",null);
【√】$("#file").val("");
【√】$("#file").val(null);

为什么同样是改变value值,得到的结果却不同呢?

释疑:

查阅stackoverflow《jQuery .val() vs .attr(“value”)》Question,里面解答如下:

The gist is that .attr(...) is only getting the objects value at the start (when the html is created). val() is getting the object's property value which can change many times.

翻译过来就是:

.val()设置的是input的value属性,input是HTMLInputElement的实例,value是通过setter方法定义的,当被赋值时,就会把值写到input里面;而改变value属性的方法,实际上操作的是dom的value属性,会触发浏览器的repaint,更新input的值。

以上所述是小编给大家介绍的从重置input file标签中看jQuery的 .val() 和 .attr(“value”) 区别 ,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
用js解决数字不能换行问题
Aug 10 Javascript
Javascript中innerHTML用法实例分析
Jan 12 Javascript
JavaScript基本数据类型及值类型和引用类型
Aug 25 Javascript
利用iscroll4实现轮播图效果实例代码
Jan 11 Javascript
jquery横向纵向鼠标滚轮全屏切换
Feb 27 Javascript
JS传播事件、取消事件默认行为、阻止事件传播详解
Aug 14 Javascript
javaScript字符串工具类StringUtils详解
Dec 08 Javascript
angularJs 表格添加删除修改查询方法
Feb 27 Javascript
浅谈jquery fullpage 插件增加头部和版权的方法
Mar 20 jQuery
JavaScript封闭函数及常用内置对象示例
May 13 Javascript
微信小程序实现授权登录
May 15 Javascript
解决layer 关闭当前弹窗 关闭遮罩层 input值获取不到的问题
Sep 25 Javascript
Java框架SSH结合Easyui控件实现省市县三级联动示例解析
Jun 12 #Javascript
jQuery基于toggle实现click触发DIV的显示与隐藏问题分析
Jun 12 #Javascript
javascript jquery对form元素的常见操作详解
Jun 12 #Javascript
js实现当鼠标移到表格上时显示这一格全部内容的代码
Jun 12 #Javascript
浅谈JS中逗号运算符的用法
Jun 12 #Javascript
Node.js Addons翻译(C/C++扩展)
Jun 12 #Javascript
基于JS代码实现当鼠标悬停表格上显示这一格的全部内容
Jun 12 #Javascript
You might like
php str_replace的替换漏洞
2008/03/15 PHP
Yii把CGridView文本框换成下拉框的方法
2014/12/03 PHP
thinkPHP框架实现多表查询的方法
2018/06/14 PHP
JS 用6N±1法求素数 实例教程
2009/10/20 Javascript
Aptana调试javascript图解教程
2009/11/30 Javascript
js调用css属性写法
2013/09/21 Javascript
js网页右下角提示框实例
2014/10/14 Javascript
JavaScript设计模式之原型模式(Object.create与prototype)介绍
2014/12/28 Javascript
AngularJS在IE8的不支持的解决方法
2016/05/13 Javascript
javascript检测移动设备横竖屏
2016/05/21 Javascript
NodeJS创建最简单的HTTP服务器
2017/05/15 NodeJs
Express + Node.js实现登录拦截器的实例代码
2017/07/01 Javascript
从零开始用electron手撸一个截屏工具的示例代码
2018/10/10 Javascript
深入理解react 组件类型及使用场景
2019/03/07 Javascript
浅谈Javascript常用正则表达式应用
2019/03/08 Javascript
Node.js API详解之 net模块实例分析
2020/05/18 Javascript
Flask框架的学习指南之制作简单blog系统
2016/11/20 Python
Python 登录网站详解及实例
2017/04/11 Python
Django自定义manage命令实例代码
2018/02/11 Python
Numpy数组转置的两种实现方法
2018/04/17 Python
Django模板导入母版继承和自定义返回Html片段过程解析
2019/09/18 Python
13个Pandas实用技巧,助你提高开发效率
2020/08/19 Python
教你如何用python操作摄像头以及对视频流的处理
2020/10/12 Python
HTML5 video循环播放多个视频的方法步骤
2020/08/06 HTML / CSS
瑞士国际航空官网:SWISS
2016/07/21 全球购物
中粮集团旗下食品网上购物网站:我买网
2016/09/22 全球购物
Agoda西班牙:全球特价酒店预订
2017/06/03 全球购物
DNA基因检测和分析:23andMe
2019/05/01 全球购物
数组越界问题
2015/10/21 面试题
日语专业毕业生自荐信
2013/11/11 职场文书
数控专业应届生求职信
2013/11/27 职场文书
食品安全承诺书
2014/05/22 职场文书
房屋授权无偿使用证明
2014/11/29 职场文书
2015年转正工作总结范文
2015/04/02 职场文书
政审证明范文
2015/06/19 职场文书
redis连接被拒绝的解决方案
2021/04/12 Redis