4.6JavaScript --练习搜索框

最新推荐文章于 2024-07-20 10:36:53 发布

寒暄

最新推荐文章于 2024-07-20 10:36:53 发布

阅读量96

点赞数

分类专栏： ▶寒暄_前端文章标签： javascript

本文链接：https://blog.csdn.net/qq_41106844/article/details/105553999

版权

▶寒暄_前端专栏收录该内容

15 篇文章 0 订阅

订阅专栏

总目录：https://blog.csdn.net/qq_41106844/article/details/105553392

前端 - 子目录：https://blog.csdn.net/qq_41106844/article/details/105553354

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>搜索框</title>
</head>
<body>
<input id="ID1" type="text" value="请输入用户名" onblur="Blurs()" onfocus="Focus()">


<script>

function Focus(){

    var input=document.getElementById("ID1");
    if (input.value=="请输入用户名"){
        input.value="";
    }

};
/*解读：
    focus函数完成当用户点击文本框后，文本框内容清空。
    blurs函数完成当用户输入内容后，文本框内容不清空。
*/
function Blurs(){

    var ele=document.getElementById("ID1");
    var val=ele.value;
    if(!val.trim()){

        ele.value="请输入用户名";
    }
}

</script>
</body>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

寒暄

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
4.6JavaScript --练习搜索框

总目录：https://www.jianshu.com/p/8b3e5b2b4497前端 - 子目录：https://www.jianshu.com/p/6fdb59d92e43<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <ti...
复制链接

扫一扫