海量素材、源码、软件、教程、资源

实时更新,建站资源,各种源码、素材、软件、课程、资源,自由下载



  • 注册
  • 查看作者
  • wordpress教程:博客搜索关键词高亮显示实现代码

    最近对wordpress的一些小改进很感兴趣,可以让你的博客更加个性,也更有趣味性,下面的代码可以在结果中高亮你所搜索的关键词。首先把第一段代码放在functions.php中:

    1. function hls_set_query() {
    2. $query = attribute_escape(get_search_query());
    3. if(strlen($query) > 0){
    4. echo ‘
    5. ‘;
    6. }
    7. }
    8. function hls_init_jquery() {
    9. wp_enqueue_script(‘jquery’);
    10. }
    11. add_action(‘init’, ‘hls_init_jquery’);
    12. add_action(‘wp_print_scripts’, ‘hls_set_query’);

    将下面的代码放在header.php中,就OK了。

    1. <style type=“text/css” media=“screen”>
    2.     .hls { background: #D3E18A; }
    3. </style>
    4. <script type=“text/javascript”>
    5.    jQuery.fn.extend({
    6.      highlight: function(search, insensitive, hls_class){
    7.        var regex = new RegExp(“(<[^>]*>)|(\\b”+ search.replace(/([-.*+?^${}()|[\]\/\\])/g,“\\$1”) +“)”, insensitive ? “ig” : “g”);
    8.        return this.html(this.html().replace(regex, function(a, b, c){
    9.          return (a.charAt(0) == “<“) ? a : “<strong class=\””+ hls_class +“\”>” + c + “</strong>”;
    10.       }));
    11.      }
    12.    });
    13.    jQuery(document).ready(function($){
    14.     if(typeof(hls_query) != ‘undefined’){
    15.       $(“#post-area”).highlight(hls_query, 1, “hls”);
    16.      }
    17.   });
    18. </script>
  • 0
  • 0
  • 0
  • 30
  • 请登录之后再进行评论

    登录
    聊天
    关注 1
    • 今日签到
    • 累计签到

    暂没有数据

  • 安逸
  • tcotu
  • an
    an
  • 发布
  • 任务
  • 动态
  • 到底部
  • 单栏布局 侧栏位置:
    关闭窗口
    下载海报