为wordpress站点的搜索框添加默认文字提示,增强用户体验。
<input type=”text” name=”s” id=”s” size=”15″ value=”<?php echo (get_search_query() ? get_search_query() : ‘Your Default Text‘); ?>” onfocus=”if ((this.value == ‘Your Default Text‘)) {this.value = ”;}” onblur=”if (this.value == ”) {this.value = ‘<?php _e(‘Your Default Text‘,’jessica’) ?>’;}” name=”s” id=”s” />
有1位同学留下了脚印
jessica用jquery的方法非常方便,以后可以通用。你可以看下知乎得注册页,就是用jquery这种方法,你可以把它封装起来以后通用。 。就是placeholder这个属性,填写你需要提示给用户的文字就可以来。还有这段脚本
$(function(){
$(“[placeholder]“).focus(function() {
var input = $(this);
if (input.val() == input.attr(“placeholder”)) {
input.val(“”);
input.removeClass(“placeholder”);
}
}).blur(function() {
var input = $(this);
if (input.val() == “” || input.val() == input.attr(“placeholder”)) {
input.addClass(“placeholder”);
input.val(input.attr(“placeholder”));
}
}).blur();
$(“[placeholder]“).parents(“form”).submit(function() {
$(this).find(“[placeholder]“).each(function() {
var input = $(this);
input.val(input.val() == input.attr(“placeholder”) ? “” : goog.string.htmlEscape(input.val()));
})
});
});