JQuery实现“请输入关键字”文本框输入效果

最新推荐文章于 2023-02-16 17:21:33 发布

Zool_happy

最新推荐文章于 2023-02-16 17:21:33 发布

阅读量2.6k

点赞数

分类专栏： JQuery 文章标签： jquery function xhtml html class

本文链接：https://blog.csdn.net/Zool_happy/article/details/6410102

版权

JQuery 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type ="text/css" >
    .text{ color :Gray;}
    </style>
    <script src="jquery-1.5.1.min.js" type="text/javascript"></script>
    <script type ="text/javascript" >
        $(function() {
            $("#txt").focus(function() {
                if ($(this).val() == "请输入关键字")
                    $(this).val("");
                $(this).removeClass("text");
            }).blur(function() {
            if ($(this).val() == "") {
                    $(this).val("请输入关键字"); $(this).addClass("text");
                }


            })
        })
    </script>
</head>
<body>
<input type ="text" value ="请输入关键字" id="txt" class ="text" />
</body>
</html>