WordPress搜索框如何屏蔽恶意关键词搜索

2018-11-02    来源:学做网站论坛

容器云强势上线!快速搭建集群,上万Linux镜像随意使用

我们之前的建站教程中,讲了如何制作WordPress程序搜索功能。搜索功能的目的是方便用户搜索需要的内容,但往往却被别人使用恶意关键词搜索,非常的不好。

屏蔽恶意关键词搜索的方法,网上很多都是使用functions函数方法,但这种方法的最大缺点是别人已经搜索过后才提示恶意关键词。而今天学做网站论坛要给学习如何做网站的同学介绍一种使用JQUERY的方法屏蔽恶意关键词搜索的方法,当用户输入恶意关键词时,就会验证提示并阻止搜索。

WordPress搜索框如何屏蔽恶意关键词搜索

代码如下:

搜索框代码:


?<form role="search" method="get" id="searchform" class="searchform" action="<?php echo home_url( '/' ); ?>">     
            <input type="text" value="" name="s" id="s" class="required"/>
?           <input type="submit" value="搜索" id="send" />        
    </form>

屏蔽恶意关键词的JQUERY代码


<script>
?       //为表单元素添加失去焦点事件
?       $("form :input").blur(function(){
?           var $parent = $(this).parent();
?           $parent.find(".msg").remove(); //删除以前的提醒元素(find():查找匹配元素集中元素的所有匹配元素)
?           //验证输入词
?           if($(this).is("#s")){
?               var nameVal = $.trim(this.value); //原生js去空格方式:this.replace(/(^\s*)|(\s*$)/g, "")
?               var regName = /[~#^$@%&!*()<>:;'"{}【】恶意关键词]/;
?               if(nameVal == "" || regName.test(nameVal)){
?                   var errorMsg = " 搜索词不能为空,不能包括限制词!";
?                   //class='msg onError' 中间的空格是层叠样式的格式
?                   $parent.append("<span class='msg onError'>" + errorMsg + "</span>");
?               }
?           }
?       }).keyup(function(){
?           //triggerHandler 防止事件执行完后,浏览器自动为标签获得焦点
?           $(this).triggerHandler("blur");
?       }).focus(function(){
?           $(this).triggerHandler("blur");
?       });

?       //点击重置按钮时,通过trigger()来触发文本框的失去焦点事件
?       $("#send").click(function(){
?           //trigger 事件执行完后,浏览器会为submit按钮获得焦点
?           $("form .required:input").trigger("blur");
?           var numError = $("form .onError").length;
?           if(numError){
?               return false;
?           }
?       });
?   </script>

将自己网站的搜索框代码替换成以上二个代码的组合即可。这样别人再搜索恶意关键词时,搜索功能就不会起作用了,真正把屏蔽恶意关键词搜索做到了搜索动作的前面。

标签: 代码 建站 建站教程 搜索

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点!
本站所提供的图片等素材,版权归原作者所有,如需使用,请与原作者联系。

上一篇:网站图片轮播图功能制作

下一篇:WORDPRESS调用网站最新发布的评论