搜索

wordpress搜索框添加默认文字,增强用户体验

0413

为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位同学留下了脚印

  1. 周威 2011-10-01

    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()));
    })
    });
    });

    回复

同学有话要说吗?