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值置空。

时间: 2024-08-13 20:12:16

input placeholder 兼容问题的相关文章

input placeholder兼容ie10以下

代码如下: if( /msie/.test(navigator.userAgent.toLowerCase()) && $.browser.version.slice(0,3) < 10) { $('input[placeholder]').each(function(){ var input = $(this); $(input).val(input.attr('placeholder')); $(input).focus(function(){ if (input.val() =

IE9以下 placeholder兼容

//input placeholder兼容!(function ($, doc, win) { $.fn.placeholder = function () { var i = doc.createElement('input'), placeholdersupport = 'placeholder' in i; if (!placeholdersupport) { var inputs = $(this); inputs.each(function () { var input = $(thi

改进《完美让IE兼容input placeholder属性的jquery实现》的不完美

<完美让IE兼容input placeholder属性的jquery实现>中的代码在IE9以下浏览器中会出错,原因是因为ie9以下的浏览器对input的标签的解释不同. 例如对以下文本框的解释: <input id="itxt" class="itext" type="text" title="这是一个文本框" value="点我输入内容" tabindex="1" m

完美让IE兼容input placeholder属性的jquery实现

调用时直接引用jquery与下面的js就行了,相对网上的大多数例子来说,这个是比较完美的方案. /* * 球到西山沟 * http://www.cnzj5u.com * 2014/11/26 12:12 */ (function ($) { //判断是否支持placeholder function isPlaceholer() { var input = document.createElement("input"); return "placeholder" in

placeholder兼容

<!------------placeholder兼容-------------><script type="text/javascript">    $(function () {        if (!placeholderSupport()) {   // 判断浏览器是否支持 placeholder            $('[placeholder]').focus(function () {                var input = $

☆☆☆☆☆Placeholder兼容各大浏览器的例子☆☆☆☆☆

<!doctype html> <html> <head> <meta charset="utf-8"> <title>Placeholder兼容各大浏览器的例子</title> <script src="jquery-1.8.0.min.js"></script> </head> <body> <form> <div> &

IE placeholder兼容

对于placeholder兼容问题 IE系列的大部分不兼容 使用JQ插件解决这个问题,确实用法很简单 jS下载地址http://www.ijquery.cn/js/jquery.placeholder.min.js <script type="text/javascript" src="http://www.ijquery.cn/js/jquery-1.7.2.min.js"></script> <script type="t

placeholder 兼容 IE

placeholder 是 html5 的新属性,仅支持 html5 的浏览器才支持 placeholder,目前最新的 FF.Chrome.Safari.Opera 以及 IE10 都支持,IE6-IE9 都不支持! placeholder 在各个浏览器下基本都是淡灰色显示,不同的地方在于 FF 和 Chrome 中,输入框获得焦点时,placeholder 文字没有变化,只有当输入框中输入了内容时,placeholder 文字才会消失:而在 Safari 和 IE10 下,当输入框获得焦点时

让 IE 8 及以下浏览器支持 表单 input [placeholder] 属性

在我们的日常开发中,时常会遇到要求兼容 ie低版本 的项目,其中表单多的项目,其中 用到 placeholder 属性几乎是必不可少的. placeholder是一个很实用的Html 5属性.但是该属性在低版本的IE下是无效的. 于是在网上找了很多方法,就以下方法,比较简单方便. 首先新建一个js文件,把下方代码,放到一个JS文件里面,页面直接引入即可. //解决ie下 input 的placeholder不显示问题 var JPlaceHolder = { //检测 _check: funct