input placeholder 兼容问题
placeholder是html5出的新特性,ie9以下是不兼容的,
那么为了兼容ie9 我们需要对他做处理
//jq的处理方式
$(function(){
jQuery('[placeholder]').focus(function() {
var input = jQuery(this);
if (input.val() == input.attr('placeholder')) {
input.val('');
input.removeClass('placeholder');
}
}).blur(function() {
var input = jQuery(this);
if (input.val() == '' || input.val() == input.attr('placeholder')) {
input.addClass('placeholder');
input.val(input.attr('placeholder'));
}
}).blur().parents('form').submit(function() {
jQuery(this).find('[placeholder]').each(function() {
var input = jQuery(this);
if (input.val() == input.attr('placeholder')) {
input.val('');
}
})
});
console.log($('input'))
})
这是jq的处理方式是把 input的 val 值设置和placeholder的值一样,然后通过获取焦点,失去焦点来判断val的值,最重要的是表单提交的时候,必须把val值判断一遍,如果val值还和placeholder的值一样,证明没修改过,提交前必须把val值置空。
input placeholder 兼容问题的更多相关文章
- input placeholder兼容ie10以下
代码如下: ,) < ) { $('input[placeholder]').each(function(){ var input = $(this); $(input).val(input.a ...
- IE9以下 placeholder兼容
//input placeholder兼容!(function ($, doc, win) { $.fn.placeholder = function () { var i = doc.createE ...
- 改进《完美让IE兼容input placeholder属性的jquery实现》的不完美
<完美让IE兼容input placeholder属性的jquery实现>中的代码在IE9以下浏览器中会出错,原因是因为ie9以下的浏览器对input的标签的解释不同. 例如对以下文本框的 ...
- 完美让IE兼容input placeholder属性的jquery实现
调用时直接引用jquery与下面的js就行了,相对网上的大多数例子来说,这个是比较完美的方案. /* * 球到西山沟 * http://www.cnzj5u.com * 2014/11/26 12:1 ...
- placeholder兼容
<!------------placeholder兼容-------------><script type="text/javascript"> $( ...
- placeholder兼容方法(兼容IE8以上浏览器)
//placeholder兼容方法(兼容IE8以上浏览器) var JPlaceHolder = { //检测 _check: function () { return 'placeholder' i ...
- IE8 placeholder兼容+Password兼容
对于placeholder兼容问题 IE系列的大部分不兼容 使用JQ插件解决这个问题,确实用法很简单 jS下载地址http://www.ijquery.cn/js/jquery.placeholder ...
- placeholder在不同浏览器下的表现及兼容方法 placeholder兼容
1.什么是placeholder? placeholder是html5新增的一个属性,当input或者textarea设置了该属性后,该值的内容将作为灰字提示显示在文本框中,当文本框获得焦点(或 ...
- placeholder 兼容 IE
placeholder 是 html5 的新属性,仅支持 html5 的浏览器才支持 placeholder,目前最新的 FF.Chrome.Safari.Opera 以及 IE10 都支持,IE6- ...
随机推荐
- c语言作业1
- PAT L2-028 秀恩爱分得快
https://pintia.cn/problem-sets/994805046380707840/problems/994805054698012672 古人云:秀恩爱,分得快. 互联网上每天都有大 ...
- 代码编写规范Asp.Net(c#)
1 目的 为了统一公司软件开发的设计过程中关于代码编写时的编写规范和具体开发工作时的编程规范,保证代码的一致性,便于交流和维护,特制定此规范. 2 范围 本规范适用于开发组 ...
- openstack之neutron
Neutron neutron主要就是用于网络虚拟化,之前将nova的时候说过,网络部分没有写,因为openstack中的网络属于一个大部分,所以今天咱们就来看看neutron到底是怎么样实现网络虚拟 ...
- JS作用域-面向对象
1. 其它语言是以代码块作为作用域的.下面程序会报错(如C,C++中),因为局部变量name只在{ }代码块中生效.打印console.writeline(name)中的name时就会报错. pu ...
- 【刷题】UOJ #34 多项式乘法
这是一道模板题. 给你两个多项式,请输出乘起来后的多项式. 输入格式 第一行两个整数 \(n\) 和 \(m\) ,分别表示两个多项式的次数. 第二行 \(n+1\) 个整数,表示第一个多项式的 \( ...
- BZOJ4198 & 洛谷2168 & UOJ130:[NOI2015]荷马史诗——题解
https://www.lydsy.com/JudgeOnline/problem.php?id=4198 https://www.luogu.org/problemnew/show/P2168 ht ...
- SQL_MODE
一 声明 标红部分为重点了解 原文:https://segmentfault.com/a/1190000005936172 二 SQL_MODE参数值 官方手册专门有一节介绍 https://dev. ...
- Chrome浏览器的使用技巧
查询Chrome浏览器自身的DNS缓存 在浏览器的地址栏输入:chrome://net-internals/#dns 在左侧的菜单栏,点击对应菜单可以查看对应选项的相关内容. 在Chrome浏览器中输 ...
- ACE接受器-连接器模式
转载于:http://www.cnblogs.com/TianFang/archive/2006/12/22/600191.html 接受器-连接器设计模式(Acceptor-Connector)使分 ...