扫码关注官方订阅号
请问用上面这种方式,如果设置了value的默认颜色,怎么避免输入时的颜色不一样?
光阴似箭催人老,日月如移越少年。
有一款插件,基于jq 叫placholder,你可以试一试
<input type="text" name="搜索" value="搜索" placeholder="搜索" id="selector"/>
这个placeholder在ff、chrome等浏览器支持修改样式
::-moz-placeholder{color:red;} //ff ::-webkit-input-placeholder{color:red;} //chrome,safari :-ms-input-placeholder{color:red;} //ie10
然后判断一下 如果浏览器不支持placeholder(我这个例子只判断了ie8),再进行js模拟placeholder的操作
placeholder
$(function(){ if(!!navigator.userAgent.match(/MSIE 8.0/)){ $('input[placeholder], textarea[placeholder]').each(function() { var input = $(this); if (input.val() === '' && input.attr("placeholder") !== ''){ input.addClass("placeholder").val(input.attr('placeholder')); } input.focus(function() { if (input.val() === input.attr('placeholder')) { input.val(''); } }); input.blur(function() { if (input.val() === '' || input.val() === input.attr('placeholder')) { input.val(input.attr('placeholder')); } }); }); } });
注释::text选择所有类型为text的input元素。如果需要自定义样式,并且希望placeholder在所有浏览器下表现一致,可以通过利用label标签模拟一个placeholder的样式放到输入框上,当输入框获得焦点的时候,隐藏label,当输入框失去焦点的时候,显示label。根据以上的代码 你就可以设置placeholder这个class的style了
label
class
style
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
有一款插件,基于jq 叫placholder,你可以试一试
这个placeholder在ff、chrome等浏览器支持修改样式
然后判断一下 如果浏览器不支持placeholder(我这个例子只判断了ie8),再进行js模拟
placeholder的操作注释:
:text选择所有类型为text的input元素。
如果需要自定义样式,并且希望
placeholder在所有浏览器下表现一致,可以通过利用label标签模拟一个placeholder的样式放到输入框上,当输入框获得焦点的时候,隐藏label,当输入框失去焦点的时候,显示label。根据以上的代码 你就可以设置
placeholder这个class的style了