wordpress搜索框动态文字

在访问很多wordpress站点的时候,通常会发现很多wordpress博客喜欢在自己博客里放一个搜索框,有的使用自带搜索,有的集成了goolge搜索,然而无论哪种情况,博主都会想法设法把搜索框设置的好看一点,一个简单的效果就是动态改变文字。

通常情况是搜索框有一个默认文字,比如“搜的一下”,“给我搜!”,还有西洋一点的“search…”等等等等,在你点击这个框的时候文字消失,如果没有输入内容,在取消输入的时候又回到之前的状态。

下面来说说解决方案,毫无疑问,这是一个用jQuery可以轻松搞定的效果,下面是一段比较成熟的代码解决方案。

// Search
jQuery("input#sear_txt").val("Search...");
textReplacement(jQuery('input#sear_txt').css("color", "#aaa"));
function textReplacement(input){ 
var originalvalue = input.val();
input.focus( function(){
if( jQuery.trim(input.val()) == originalvalue ){ input.val("").css("color", "#666"); }
});
 input.blur( function(){
if( jQuery.trim(input.val()) == "" ){ input.val(originalvalue).css("color", "#aaa"); }
});
}

这里面定义了一个函数专门用来处理搜索框的相关操作,逻辑神马的这里就不做解释了,其中input#sear_txt,#sear_txt改变你搜索输入框的ID即可。

 标签: wordpress, 搜索, 动态文字

作者  :  sailor

一蓑烟雨看苍生,半壶浊酒笑红尘


  1. 请问博主程序,是否接一小项目,几个页面,
    设计要求美观,简单php程序。

    March 22nd, 2012 at 06:02 pm 回复
      1. YQC
        YQC

        可以,联系QQ:61817708

        March 22nd, 2012 at 09:27 pm 回复
  2. uk vpn
    2#
    uk vpn

    谢谢你的分享。伟大的职位。

    July 14th, 2012 at 08:33 am 回复


最新文章