从重置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 相关文章推荐
JQuery最佳实践之精妙的自定义事件
Aug 11 Javascript
node.js中的定时器nextTick()和setImmediate()区别分析
Nov 26 Javascript
JS实现两表格里数据来回转移的方法
May 28 Javascript
AngularJS基础教程之简单介绍
Sep 27 Javascript
jquery.cookie实现的客户端购物车操作实例
Dec 24 Javascript
jQuery自适应轮播图插件Swiper用法示例
Aug 24 Javascript
javascript入门之数组[新手必看]
Nov 21 Javascript
node.js基于mongodb的搜索分页示例
Jan 22 Javascript
详解angularJS动态生成的页面中ng-click无效解决办法
Jun 19 Javascript
vue自定义底部导航栏Tabbar的实现代码
Sep 03 Javascript
vue-cli随机生成port源码的方法
Sep 02 Javascript
微信小程序封装多张图片上传api代码实例
Dec 30 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
给初学者的30条PHP最佳实践(荒野无灯)
2011/08/02 PHP
php共享内存段示例分享
2014/01/20 PHP
PHP工程师VIM配置分享
2015/12/15 PHP
PHP中strpos、strstr和stripos、stristr函数分析
2016/06/11 PHP
PHP将身份证正反面两张照片合成一张图片的代码
2017/04/08 PHP
javascript中的107个基础知识收集整理 推荐
2010/03/29 Javascript
window.location不跳转的问题解决方法
2014/04/17 Javascript
DOM节点删除函数removeChild()用法实例
2015/01/12 Javascript
解决Jquery向页面append新元素之后事件的绑定问题
2015/03/16 Javascript
JavaScript转换与解析JSON方法实例详解
2015/11/24 Javascript
JS排序方法(sort,bubble,select,insert)代码汇总
2016/01/30 Javascript
JavaScript作用域示例详解
2016/07/07 Javascript
xmlplus组件设计系列之选项卡(Tabbar)(5)
2017/05/03 Javascript
JavaScript 获取元素在父节点中的下标(推荐)
2017/06/28 Javascript
Vue学习笔记进阶篇之过渡状态详解
2017/07/14 Javascript
vue2.0实现移动端的输入框实时检索更新列表功能
2018/05/08 Javascript
自己动手封装一个React Native多级联动
2018/09/19 Javascript
vuex实现购物车的增加减少移除
2020/06/28 Javascript
基于JavaScript的数据结构队列动画实现示例解析
2020/08/06 Javascript
简洁的十分钟Python入门教程
2015/04/03 Python
Python中的特殊语法:filter、map、reduce、lambda介绍
2015/04/14 Python
在Python中使用PIL模块处理图像的教程
2015/04/29 Python
Python中创建字典的几种方法总结(推荐)
2017/04/27 Python
python3实现抓取网页资源的 N 种方法
2017/05/02 Python
python深度优先搜索和广度优先搜索
2018/02/07 Python
Python实现的HMacMD5加密算法示例
2018/04/03 Python
使用 Python 在京东上抢口罩的思路详解
2020/02/27 Python
Python+MySQL随机试卷及答案生成程序的示例代码
2021/02/01 Python
英国和爱尔兰最大的地毯零售商:Kukoon
2018/12/17 全球购物
教师个人自我鉴定
2014/02/08 职场文书
餐饮部总监岗位职责范文
2014/02/13 职场文书
幼儿园教师师德师风演讲稿:爱我所爱 无悔青春
2014/09/10 职场文书
龙猫观后感
2015/06/09 职场文书
2015大学生暑期实习报告
2015/07/13 职场文书
大学生十八大感想
2015/08/11 职场文书
java中为什么说子类的构造方法默认访问的是父类的无参构造方法
2022/04/13 Java/Android