input 前几天 为了这个词 用在搜索框被我们总监喷,为了加强印象,我把它记录下来
最原始的造型
<input type="text" value="搜索"/> 作成搜索框 比较尴尬,因为鼠标放上去 字居然还在 ,特难受 解决此问题!!!第一中方法
<input type="text" value="搜索" id="sou"/>
$("#sou").focus(function () {
if ($(this).val() == "请输入关键字")
$(this).val("");
});
$("#sou").blur(function () {
if ($(this).val() == "")
$(this).val("请输入关键字");
});
上面方法是input框 鼠标focus的时候value消失 然而现在很多input框 并不是那样,focus的时候还在 ,只有当输入文字的时候才没了这时候我们可以考虑使用h5的属性 placeholder 这时候问题来了 使用h5 华丽奔放 杠杆的 可是同样的兼容性也不能小觑
<input type="text" placeholder="搜索" id="test"/>这里利用原生js进行封装这是我在曾经访问过一位大神 里面的 我们到时候项目中用到 直接调用就好了 地址:http://www.zhangxinxu.com/study/js/jquery.placeholder.js
$(function() { $("#test").placeholder(); }); </script>即可
时间: 2024-10-04 19:26:13