项目中用到的input 遇到的问题的归类

　　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>即可

巴特西

项目中用到的input 遇到的问题的归类

最新文章

热门文章