码迷,mamicode.com
首页 > 其他好文 > 详细

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

时间:2015-09-17 23:02:16      阅读:139      评论:0      收藏:0      [点我收藏+]

标签:

  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 遇到的问题的归类

标签:

原文地址:http://www.cnblogs.com/guxiaosao/p/4812899.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!