PlaceHolder的二种落成方式,input点击后placeholder中的提醒新闻未有

by admin on 2019年7月14日

html中,placeholder作为input的壹天质量,起到了在输入框中占位并提示的职能。

input点击后placeholder中的提醒新闻未有,inputplaceholder

html中,placeholder作为input的三个属性,起到了在输入框中占位并提示的效应。

必发88,只是有局地浏览器,如chrome,当鼠标点击输入框时,placeholder的值不流失,只有输入数据才消失,会使前端用户体验大减价扣。

PlaceHolder的二种落成方式,input点击后placeholder中的提醒新闻未有。看了大多大神的不二等秘书诀,写了长长的js,望着有一点困难,就想开了上面这种最傻的法子消除了这一个难点。

html代码:

<input type="text" placeholder="多个关键词空格隔开"> 

鼠标点击input时,placeholder中的提示新闻消失:

<input type="text" placeholder="多个关键词空格隔开" onfocus="this.placeholder=‘‘" onblur="this.placeholder=‘多个关键词空格隔开‘">

PlaceHolder的二种达成格局

placeholder属性是HTML5中为input加多的。在input上提供贰个占位符,文字方式体现输入字段预期值的提醒消息(hint),该字段会在输入为空时呈现。

<input type="text" name="loginName" placeholder="邮箱/手机号/QQ号"> 

现阶段浏览器的支撑情状

不过,尽管IE10+援助placeholder属性,它的变现与任何浏览器也差别
•IE10+里鼠标点击时(获取关节)placeholder文本消失
•Firefox/Chrome/Safari点击不消退,而是键盘输入时文本消失

这一定恶心,要是应用了placeholder属性。产品经营依然不依不饶,会讲怎么IE里是点击的时候提示文本消失,Chrome里却是键盘输入的时候提醒文本消失。必要前端程序猿改成一样的表现情势。鉴于此,以下二种完结方式均不选取原生的placeholder属性。

两种办法的思路

1.(格局一)使用input的value作为显示文本

2.(情势二)不选择value,增多三个相当的价签(span)到body里然后相对定位覆盖到input上面

三种方法半斤八两点,情势一占用了input的value属性,表单提交时索要特别做一些决断职业,格局二则选取了附加的竹签。

方式一

/**
* PlaceHolder组件
* $(input).placeholder({
* word: // @string 提示文本
* color: // @string 文本颜色
* evtType: // @string focus|keydown 触发placeholder的事件类型
* })
*
* NOTE:
* evtType默认是focus,即鼠标点击到输入域时默认文本消失,keydown则模拟HTML5 placeholder属性在Firefox/Chrome里的特征,光标定位到输入域后键盘输入时默认文本才消失。
* 此外,对于HTML5 placeholder属性,IE10+和Firefox/Chrome/Safari的表现形式也不一致,因此内部实现不采用原生placeholder属性
*/
$.fn.placeholder = function(option, callback) {
var settings = $.extend({
word: '',
color: '#ccc',
evtType: 'focus'
}, option)
function bootstrap($that) {
// some alias 
var word = settings.word
var color = settings.color
var evtType = settings.evtType
// default
var defColor = $that.css('color')
var defVal = $that.val()
if (defVal == '' || defVal == word) {
$that.css({color: color}).val(word)
} else {
$that.css({color: defColor})
}
function switchStatus(isDef) {
if (isDef) {
$that.val('').css({color: defColor}) 
} else {
$that.val(word).css({color: color})
}
}
function asFocus() {
$that.bind(evtType, function() {
var txt = $that.val()
if (txt == word) {
switchStatus(true)
}
}).bind('blur', function() {
var txt = $that.val()
if (txt == '') {
switchStatus(false)
}
})
}
function asKeydown() {
$that.bind('focus', function() {
var elem = $that[0]
var val = $that.val()
if (val == word) {
setTimeout(function() {
// 光标定位到首位
$that.setCursorPosition({index: 0})
}, 10) 
}
})
}
if (evtType == 'focus') {
asFocus()
} else if (evtType == 'keydown') {
asKeydown()
}
// keydown事件里处理placeholder
$that.keydown(function() {
var val = $that.val()
if (val == word) {
switchStatus(true)
}
}).keyup(function() {
var val = $that.val()
if (val == '') {
switchStatus(false)
$that.setCursorPosition({index: 0})
}
})
}
return this.each(function() {
var $elem = $(this)
bootstrap($elem)
if ($.isFunction(callback)) callback($elem)
})
}

方式二

$.fn.placeholder = function(option, callback) {
var settings = $.extend({
word: '',
color: '#999',
evtType: 'focus',
zIndex: 20,
diffPaddingLeft: 3
}, option)
function bootstrap($that) {
// some alias 
var word = settings.word
var color = settings.color
var evtType = settings.evtType
var zIndex = settings.zIndex
var diffPaddingLeft = settings.diffPaddingLeft
// default css
var width = $that.outerWidth()
var height = $that.outerHeight()
var fontSize = $that.css('font-size')
var fontFamily = $that.css('font-family')
var paddingLeft = $that.css('padding-left')
// process
paddingLeft = parseInt(paddingLeft, 10) + diffPaddingLeft
// redner 
var $placeholder = $('')
$placeholder.css({
position: 'absolute',
zIndex: '20',
color: color,
width: (width - paddingLeft) + 'px',
height: height + 'px',
fontSize: fontSize,
paddingLeft: paddingLeft + 'px',
fontFamily: fontFamily
}).text(word).hide()
// 位置调整 
move()
// textarea 不加line-heihgt属性
if ($that.is('input')) {
$placeholder.css({
lineHeight: height + 'px'
})
}
$placeholder.appendTo(document.body)
// 内容为空时才显示,比如刷新页面输入域已经填入了内容时
var val = $that.val()
if ( val == '' && $that.is(':visible') ) {
$placeholder.show()
}
function hideAndFocus() {
$placeholder.hide()
$that[0].focus()
}
function move() {
var offset = $that.offset()
var top = offset.top
var left = offset.left
$placeholder.css({
top: top,
left: left
})
}
function asFocus() {
$placeholder.click(function() {
hideAndFocus()
// 盖住后无法触发input的click事件,需要模拟点击下
setTimeout(function(){
$that.click()
}, 100)
})
// IE有些bug,原本不用加此句
$that.click(hideAndFocus)
$that.blur(function() {
var txt = $that.val()
if (txt == '') {
$placeholder.show()
}
})
}
function asKeydown() {
$placeholder.click(function() {
$that[0].focus()
})
}
if (evtType == 'focus') {
asFocus()
} else if (evtType == 'keydown') {
asKeydown()
}
$that.keyup(function() {
var txt = $that.val()
if (txt == '') {
$placeholder.show()
} else {
$placeholder.hide()
}
})
// 窗口缩放时处理
$(window).resize(function() {
move()
})
// cache
$that.data('el', $placeholder)
$that.data('move', move)
}
return this.each(function() {
var $elem = $(this)
bootstrap($elem)
if ($.isFunction(callback)) callback($elem)
})
}

主意2 对于以下情况不切合

  1. input初步遮盖

  此时不能取到input的offset,继而不或然稳定span到input下面。

  1. 饱含input的页面dom结构发生变化

  比如页面里删除了一些要素或增多了一些要素,导致input向上或向下偏移,而此时span则尚未撼动(span相对body定位)。那正如恶心,可以思虑把span作为input的汉子成分,即相对内层div定位(并非body)。但这么必须强制给外层div增加position:relative,增加后恐怕会对页面布局产生一定影响。

placeholder属性是HTML5 中为input加多的。在input上提供贰个占位符,文字格局显得输入字段预期值的提示新闻(hint),该字段会在输入为空时显示。

至于HTML5 Placeholder新标签低版本浏览器下不相称的主题材料浅析及解决办法,html5placeholder

placeholder 属性是 HTML第55中学的新属性,俗名字为“占位符”,成效周边于输入框在获取难题时,时面包车型客车暗许值会产生空白,当失去大旨时又会显得暗许的文书,作者想大家自然使用
js/jquery制作过这样的功力。方今独有在Mozilla Firefox 3.7+、Apple Safari
4+、谷歌 Chrome 4+、Opera11+等今世浏览器补助。”
placeholder属性是HTML5中为input增多的。在input上提供二个占位符,文字方式显得输入字段预期值的提醒音信(hint),该字段会在输入为空时显示。
实例:

代码如下:
<input type=”text” name=”userName” placeholder=”请输入用户名”>

placeholder操作起来极其平价,升高了支付效能,相同的时间在高版本浏览器中用户体验也很好,所以本人很欢娱用那特性情。
可是,在IE9以下版本浏览器就失效了,何况IE10+协助placeholder属性,它的显示与另外浏览器也分裂
PlaceHolder的二种落成方式,input点击后placeholder中的提醒新闻未有。•IE10+里鼠标点击时(获取关节)placeholder文本消失
•Firefox/Chrome/Safari点击不毁灭,而是键盘输入时文本消失
那正是说作为一名开拓职员,是或不是合宜去制服消除这么些主题素材啊。如今英特网也一群类似消除方案,大约达成思路分为二种:
1.(形式一)使用input的value作为彰显文本,模拟金黄样式,focus让$(“[placeholder]”).val()==””,blur时$(“[placeholder]”).val(this.defaultValue);
2.(形式二)不行使value,增加四个异常的价签(span)到body里然后相对定位覆盖到input下边。
在这里因第一种办法贯彻起来,占用了value且验证时须求做额外的决断,那么个人提出选择第二种形式。
第一,判定当前浏览器是或不是匡助placeholder属性:

代码如下:
function placeholderSupport() {
return ‘placeholder’ in document.createElement(‘input’);
}

上第一代码:

代码如下:
/*
*placeholder兼容ie9以下 author:高丰鸣 add 2016-1-27
*/
$(function(){
if(!placeholderSupport()){ // 决断浏览器是或不是帮衬 placeholder
$(document).ready(function(){
//默许遍历循环增多placeholder
$(‘[placeholder]’).each(function(){
$(this).parent().append(“<span
class=’placeholder’>”+$(this).attr(‘placeholder’)+”</span>”);
})
$(‘[placeholder]’).blur(function(){
if($(this).val()!=””){ //假使当前值不为空,隐蔽placeholder
$(this).parent().find(‘span.placeholder’).hide();
}
else{
$(this).parent().find(‘span.placeholder’).show();
}
})
});
}
});

以上内容给大家介绍了有关HTML5
Placeholder新标签低版本浏览器下不匹配的难题剖析及化解办法
的相关内容,希望对我们有所支持。

Placeholder新标签低版本浏览器下不一样盟的难题浅析及消除办法,html5placeholder
placeholder 属性是 HTML5 中的新属性,俗名称为占位符,功…

只是有部分浏览器,如chrome,当鼠标点击输入框时,placeholder的值不消退,独有输入数据才未有,会使前端用户体验大优惠扣。

你或者感兴趣的作品:

  • jQuery达成表单input中唤醒文字value随鼠标核心移进移出而展现或潜伏的代码
  • 让低版本浏览器援救input的placeholder属性(js方法)
  • C# SendInput 模拟鼠标操作的兑现格局
  • 采取jQuery急速解决input中placeholder值在ie中无法支撑的标题

html中,placeholder作为input的叁性格质,起到了在输入框中占位并提醒的成效。
可是有一…

看了许多大神的艺术,写了修长js,瞅着有一些困难,就想开了上边这种最傻的方式消除了那些难点。

<input type="text" name="loginName" placeholder="邮箱/手机号/QQ号">

html代码:

 

<input type="text" placeholder="多个关键词空格隔开"> 

当下浏览器的接济情形

鼠标点击input时,placeholder中的提醒音讯消失:

浏览器 IE6/7/8/9 IE10+ Firefox Chrome Safari 
是否支持 NO YES YES YES YES
<input type="text" placeholder="多个关键词空格隔开" onfocus="this.placeholder=‘‘" onblur="this.placeholder=‘多个关键词空格隔开‘">

 

PlaceHolder的二种达成格局

不过,尽管IE10+协助placeholder属性,它的变现与别的浏览器也差别

placeholder属性是HTML5中为input增多的。在input上提供贰个占位符,文字方式显得输入字段预期值的提示音信(hint),该字段会在输入为空时突显。

  • IE10+里鼠标点击时(获取关节)placeholder文本消失
  • Firefox/Chrome/Safari点击不收敛,而是键盘输入时文本消失

 

<input type="text" name="loginName" placeholder="邮箱/手机号/QQ号"> 

这一定恶心,如果选用了placeholder属性。产品经营如故不依不饶,会讲怎么IE里是点击的时候提示文本消失,Chrome里却是键盘输入的时候唤醒文本消失。供给前端工程师改成同样的表现情势。鉴于此,以下两种达成方式均不利用原生的placeholder属性。

当前浏览器的支撑景况

 

可是,固然IE10+帮衬placeholder属性,它的表现与别的浏览器也不均等
•IE10+里鼠标点击时(获取关节)placeholder文本消失
•Firefox/Chrome/Safari点击不消退,而是键盘输入时文本消失

二种格局的笔触

这一定恶心,假如选拔了placeholder属性。产品经营依旧不依不饶,会讲怎么IE里是点击的时候提醒文本消失,Chrome里却是键盘输入的时候唤醒文本消失。必要前端程序猿改成同样的表现情势。鉴于此,以下两种达成格局均不利用原生的placeholder属性。

  1. (形式一)使用input的value作为展现文本
  2. (格局二)不选用value,增添二个附加的价签(span)到body里然后相对定位覆盖到input上边

二种形式的思绪

二种艺术各有利害,情势一占用了input的value属性,表单提交时索要额外做一些决断职业,格局二则动用了附加的价签。

1.(格局一)使用input的value作为突显文本

 

2.(格局二)不利用value,增多三个外加的竹签(span)到body里然后相对定位覆盖到input上边

方式一

/**
 * PlaceHolder组件
 * $(input).placeholder({
 *   word:     // @string 提示文本
 *   color:    // @string 文本颜色
 *   evtType:  // @string focus|keydown 触发placeholder的事件类型
 * })
 *
 * NOTE:
 *   evtType默认是focus,即鼠标点击到输入域时默认文本消失,keydown则模拟HTML5 placeholder属性在Firefox/Chrome里的特征,光标定位到输入域后键盘输入时默认文本才消失。
 *   此外,对于HTML5 placeholder属性,IE10+和Firefox/Chrome/Safari的表现形式也不一致,因此内部实现不采用原生placeholder属性
 */
$.fn.placeholder = function(option, callback) {
    var settings = $.extend({
        word: '',
        color: '#ccc',
        evtType: 'focus'
    }, option)

    function bootstrap($that) {
        // some alias 
        var word    = settings.word
        var color   = settings.color
        var evtType = settings.evtType

        // default
        var defColor = $that.css('color')
        var defVal   = $that.val()

        if (defVal == '' || defVal == word) {
            $that.css({color: color}).val(word)
        } else {
            $that.css({color: defColor})
        }

        function switchStatus(isDef) {
            if (isDef) {
                $that.val('').css({color: defColor})    
            } else {
                $that.val(word).css({color: color})
            }
        }
        function asFocus() {
            $that.bind(evtType, function() {
                var txt = $that.val()
                if (txt == word) {
                    switchStatus(true)
                }
            }).bind('blur', function() {
                var txt = $that.val()
                if (txt == '') {
                    switchStatus(false)
                }
            })
        }
        function asKeydown() {
            $that.bind('focus', function() {
                var elem = $that[0]
                var val  = $that.val()
                if (val == word) {
                    setTimeout(function() {
                        // 光标定位到首位
                        $that.setCursorPosition({index: 0})
                    }, 10)                  
                }
            })
        }

        if (evtType == 'focus') {
            asFocus()
        } else if (evtType == 'keydown') {
            asKeydown()
        }

        // keydown事件里处理placeholder
        $that.keydown(function() {
            var val = $that.val()
            if (val == word) {
                switchStatus(true)
            }
        }).keyup(function() {
            var val = $that.val()
            if (val == '') {
                switchStatus(false)
                $that.setCursorPosition({index: 0})
            }
        })
    }

    return this.each(function() {
        var $elem = $(this)
        bootstrap($elem)
        if ($.isFunction(callback)) callback($elem)
    })
}

线上演示:

会用到
setCursorPosition。

 

二种艺术各有利弊,格局一占用了input的value属性,表单提交时须求拾贰分做一些剖断工作,格局二则使用了附加的标签。

方式二 

$.fn.placeholder = function(option, callback) {
    var settings = $.extend({
        word: '',
        color: '#999',
        evtType: 'focus',
        zIndex: 20,
        diffPaddingLeft: 3
    }, option)

    function bootstrap($that) {
        // some alias 
        var word    = settings.word
        var color   = settings.color
        var evtType = settings.evtType
        var zIndex  = settings.zIndex
        var diffPaddingLeft = settings.diffPaddingLeft

        // default css
        var width       = $that.outerWidth()
        var height      = $that.outerHeight()
        var fontSize    = $that.css('font-size')
        var fontFamily  = $that.css('font-family')
        var paddingLeft = $that.css('padding-left')

        // process
        paddingLeft = parseInt(paddingLeft, 10) + diffPaddingLeft

        // redner 
        var $placeholder = $('')
        $placeholder.css({
            position: 'absolute',
            zIndex: '20',
            color: color,
            width: (width - paddingLeft) + 'px',
            height: height + 'px',
            fontSize: fontSize,
            paddingLeft: paddingLeft + 'px',
            fontFamily: fontFamily
        }).text(word).hide()

        // 位置调整 
        move()

        // textarea 不加line-heihgt属性
        if ($that.is('input')) {
            $placeholder.css({
                lineHeight: height + 'px'
            })
        }
        $placeholder.appendTo(document.body)

        // 内容为空时才显示,比如刷新页面输入域已经填入了内容时
        var val = $that.val()
        if ( val == '' && $that.is(':visible') ) {
            $placeholder.show()
        }

        function hideAndFocus() {
            $placeholder.hide()
            $that[0].focus()
        }
        function move() {
            var offset = $that.offset()
            var top    = offset.top
            var left   = offset.left
            $placeholder.css({
                top: top,
                left: left
            })
        }
        function asFocus() {
            $placeholder.click(function() {
                hideAndFocus()
                // 盖住后无法触发input的click事件,需要模拟点击下
                setTimeout(function(){
                    $that.click()
                }, 100)
            })
            // IE有些bug,原本不用加此句
            $that.click(hideAndFocus)
            $that.blur(function() {
                var txt = $that.val()
                if (txt == '') {
                    $placeholder.show()
                }
            })
        }
        function asKeydown() {
            $placeholder.click(function() {
                $that[0].focus()
            })
        }

        if (evtType == 'focus') {
            asFocus()
        } else if (evtType == 'keydown') {
            asKeydown()
        }

        $that.keyup(function() {
            var txt = $that.val()
            if (txt == '') {
                $placeholder.show()
            } else {
                $placeholder.hide()
            }
        })

        // 窗口缩放时处理
        $(window).resize(function() {
            move()
        })

        // cache
        $that.data('el', $placeholder)
        $that.data('move', move)

    }

    return this.each(function() {
        var $elem = $(this)
        bootstrap($elem)
        if ($.isFunction(callback)) callback($elem)
    })
}   

线上演示:

 

艺术2 对于以下境况不合乎

1. input开首掩盖

  此时不恐怕取到input的offset,继而不能牢固span到input下边。

2. 饱含input的页面dom结构产生变化

  比如页面里删除了有个别因素或增加了有的因素,导致input向上或向下偏移,而此时span则尚未撼动(span相对body定位)。那正如恶心,能够思量把span作为input的弟兄成分,即相对内层div定位(实际不是body)。但这么必须强制给外层div增加position:relative,增加后可能会对页面布局发生一定影响。

 

相关:

http://www.w3.org/TR/2009/WD-html5-20090825/forms.html\#the-placeholder-attribute

 

方式一

/**
* PlaceHolder组件
* $(input).placeholder({
* word: // @string 提示文本
* color: // @string 文本颜色
* evtType: // @string focus|keydown 触发placeholder的事件类型
* })
*
* NOTE:
* evtType默认是focus,即鼠标点击到输入域时默认文本消失,keydown则模拟HTML5 placeholder属性在Firefox/Chrome里的特征,光标定位到输入域后键盘输入时默认文本才消失。
* 此外,对于HTML5 placeholder属性,IE10+和Firefox/Chrome/Safari的表现形式也不一致,因此内部实现不采用原生placeholder属性
*/
$.fn.placeholder = function(option, callback) {
var settings = $.extend({
word: '',
color: '#ccc',
evtType: 'focus'
}, option)
function bootstrap($that) {
// some alias 
var word = settings.word
var color = settings.color
var evtType = settings.evtType
// default
var defColor = $that.css('color')
var defVal = $that.val()
if (defVal == '' || defVal == word) {
$that.css({color: color}).val(word)
} else {
$that.css({color: defColor})
}
function switchStatus(isDef) {
if (isDef) {
$that.val('').css({color: defColor}) 
} else {
$that.val(word).css({color: color})
}
}
function asFocus() {
$that.bind(evtType, function() {
var txt = $that.val()
if (txt == word) {
switchStatus(true)
}
}).bind('blur', function() {
var txt = $that.val()
if (txt == '') {
switchStatus(false)
}
})
}
function asKeydown() {
$that.bind('focus', function() {
var elem = $that[0]
var val = $that.val()
if (val == word) {
setTimeout(function() {
// 光标定位到首位
$that.setCursorPosition({index: 0})
}, 10) 
}
})
}
if (evtType == 'focus') {
asFocus()
} else if (evtType == 'keydown') {
asKeydown()
}
// keydown事件里处理placeholder
$that.keydown(function() {
var val = $that.val()
if (val == word) {
switchStatus(true)
}
}).keyup(function() {
var val = $that.val()
if (val == '') {
switchStatus(false)
$that.setCursorPosition({index: 0})
}
})
}
return this.each(function() {
var $elem = $(this)
bootstrap($elem)
if ($.isFunction(callback)) callback($elem)
})
}

方式二

$.fn.placeholder = function(option, callback) {
var settings = $.extend({
word: '',
color: '#999',
evtType: 'focus',
zIndex: 20,
diffPaddingLeft: 3
}, option)
function bootstrap($that) {
// some alias 
var word = settings.word
var color = settings.color
var evtType = settings.evtType
var zIndex = settings.zIndex
var diffPaddingLeft = settings.diffPaddingLeft
// default css
var width = $that.outerWidth()
var height = $that.outerHeight()
var fontSize = $that.css('font-size')
var fontFamily = $that.css('font-family')
var paddingLeft = $that.css('padding-left')
// process
paddingLeft = parseInt(paddingLeft, 10) + diffPaddingLeft
// redner 
var $placeholder = $('')
$placeholder.css({
position: 'absolute',
zIndex: '20',
color: color,
width: (width - paddingLeft) + 'px',
height: height + 'px',
fontSize: fontSize,
paddingLeft: paddingLeft + 'px',
fontFamily: fontFamily
}).text(word).hide()
// 位置调整 
move()
// textarea 不加line-heihgt属性
if ($that.is('input')) {
$placeholder.css({
lineHeight: height + 'px'
})
}
$placeholder.appendTo(document.body)
// 内容为空时才显示,比如刷新页面输入域已经填入了内容时
var val = $that.val()
if ( val == '' && $that.is(':visible') ) {
$placeholder.show()
}
function hideAndFocus() {
$placeholder.hide()
$that[0].focus()
}
function move() {
var offset = $that.offset()
var top = offset.top
var left = offset.left
$placeholder.css({
top: top,
left: left
})
}
function asFocus() {
$placeholder.click(function() {
hideAndFocus()
// 盖住后无法触发input的click事件,需要模拟点击下
setTimeout(function(){
$that.click()
}, 100)
})
// IE有些bug,原本不用加此句
$that.click(hideAndFocus)
$that.blur(function() {
var txt = $that.val()
if (txt == '') {
$placeholder.show()
}
})
}
function asKeydown() {
$placeholder.click(function() {
$that[0].focus()
})
}
if (evtType == 'focus') {
asFocus()
} else if (evtType == 'keydown') {
asKeydown()
}
$that.keyup(function() {
var txt = $that.val()
if (txt == '') {
$placeholder.show()
} else {
$placeholder.hide()
}
})
// 窗口缩放时处理
$(window).resize(function() {
move()
})
// cache
$that.data('el', $placeholder)
$that.data('move', move)
}
return this.each(function() {
var $elem = $(this)
bootstrap($elem)
if ($.isFunction(callback)) callback($elem)
})
}

艺术2 对于以下场景不相符

  1. input先河掩盖

  此时无法取到input的offset,继而不可能稳定span到input下边。

  1. 包涵input的页面dom结构产生变化

  举例页面里删除了有个别因素或增加了某个因素,导致input向上或向下偏移,而这时候span则尚未撼动(span相对body定位)。那相比恶心,能够考虑把span作为input的男子儿成分,即相对内层div定位(并不是body)。但这么必须强制给外层div加多position:relative,增加后或者会对页面布局发生一定影响。

你大概感兴趣的篇章:

  • jQuery完毕表单input中晋升文字value随鼠标核心移进移出而显得或躲藏的代码
  • 让低版本浏览器帮助input的placeholder属性(js方法)
  • C# SendInput
    模拟鼠标操作的落到实处格局
  • 应用jQuery快捷消除input中placeholder值在ie中不可能支撑的标题

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图