完美解决IE不支持placeholder的问题

最新推荐文章于 2021-06-15 20:02:27 发布

白小明80583600

最新推荐文章于 2021-06-15 20:02:27 发布

阅读量1.3w

点赞数

CC 4.0 BY-SA版权

分类专栏： Web前端开发文章标签： placeholder IE不支持placeholder IE不支持placeholder的问题完美解决IE不支持placeholder

本文链接：https://blog.youkuaiyun.com/QQ80583600/article/details/62423408

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h1>你好世界</h1>
    <!-- placeholder属性在IE中，只有 IE11 支持 -->
    <input type="text" class="text1" placeholder="Enter your search text here">


    <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        // val()无参数是取值，有参数是设置
        // 为了更好的兼容性，将下面的val()设置与input中的placeholder的值设置相同
        $("input.text1").val("Enter your search text here");
        textFill($('input.text1'));
    });

    function textFill(input) {
        var originalvalue = input.val();
        input.focus(function() {
            if ($.trim(input.val()) == originalvalue) {
                input.val('');
            }
        });
        input.blur(function() {