从重置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如何判断用户是在PC端和还是移动端访问
Apr 24 Javascript
javascript处理表单示例(javascript提交表单)
Apr 28 Javascript
jQuery替换textarea中换行的方法
Jun 10 Javascript
js仿支付宝填写支付密码效果实现多方框输入密码
Mar 09 Javascript
BootStrap 轮播插件(carousel)支持左右手势滑动的方法(三种)
Jul 07 Javascript
重新理解JavaScript的六种继承方式
Mar 24 Javascript
详解react-native-fs插件的使用以及遇到的坑
Sep 12 Javascript
AngularJS实现的select二级联动下拉菜单功能示例
Oct 25 Javascript
jQuery实现滚动到底部时自动加载更多的方法示例
Feb 18 jQuery
vue 多入口文件搭建 vue多页面搭建的实例讲解
Mar 12 Javascript
详解如何配置vue-cli3.0的vue.config.js
Aug 23 Javascript
解决node-sass偶尔安装失败的方法小结
Dec 05 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
在IIS上安装PHP4.0正式版
2006/10/09 PHP
php和数据库结合的一个简单的web实例 代码分析 (php初学者)
2011/07/28 PHP
ThinkPHP查询中的魔术方法简述
2014/06/25 PHP
php+MySql实现登录系统与输出浏览者信息功能
2016/07/01 PHP
[原创]smarty简单模板变量输出方法
2016/07/09 PHP
javascript获取作用在元素上面的样式属性代码
2012/09/20 Javascript
js展开闭合效果演示代码
2013/07/24 Javascript
node.js中的fs.realpath方法使用说明
2014/12/16 Javascript
jquery动态添加删除(tr/td)
2015/02/09 Javascript
Javascript中判断一个值是否为undefined的方法详解
2016/09/28 Javascript
jQuery实现优雅的弹窗效果(6)
2017/02/08 Javascript
bootstrap table 多选框分页保留示例代码
2017/03/08 Javascript
HTML中使背景图片自适应浏览器大小实例详解
2017/04/06 Javascript
详解a++和++a的区别
2017/08/30 Javascript
jQuery中内容过滤器简单用法示例
2018/03/31 jQuery
Vue2.0实现调用摄像头进行拍照功能 exif.js实现图片上传功能
2018/04/28 Javascript
jQuery实现获取及设置CSS样式操作详解
2018/09/05 jQuery
JavaScript 点击触发复制功能实例详解
2018/11/02 Javascript
微信小程序日历效果
2018/12/29 Javascript
关于微信小程序登录的那些事
2019/01/08 Javascript
简单了解node npm cnpm的具体使用方法
2019/02/27 Javascript
在Vue项目中用fullcalendar制作日程表的示例代码
2019/08/04 Javascript
简单谈谈Python中的闭包
2016/11/30 Python
Python基于scipy实现信号滤波功能
2019/05/08 Python
详解Python的循环结构知识点
2019/05/20 Python
Python urllib request模块发送请求实现过程解析
2020/12/10 Python
BLACKMORES澳洲官网:澳大利亚排名第一的保健品牌
2018/09/27 全球购物
ALDO加拿大官网:加拿大女鞋品牌
2018/12/22 全球购物
Claire’s法国:时尚配饰、美容、珠宝、头发
2021/01/16 全球购物
毕业证委托书范文
2014/09/26 职场文书
党员检讨书
2014/10/13 职场文书
保研导师推荐信
2015/03/25 职场文书
机关保密工作承诺书
2015/05/04 职场文书
2016年圣诞节活动总结范文
2016/04/01 职场文书
MySQL 8.0 之不可见列的基本操作
2021/05/20 MySQL
Win11 22H2 2022怎么更新? 获得Win1122H22022版本升级技巧
2022/09/23 数码科技