网站建设的基本准则-WordPress显示网页搜索框的下

2021-04-11 21:01| 发布者: | 查看: |

--------

网站建设的基本准则

-------

WordPress网站內容检索假如设定往下拉內容显示信息,那末针对客户在模糊不清检索上能起到很大的协助,今日就为大伙儿共享该怎样完成:

这毫无疑问需要JS来完成了。自然,在网上这方面的JS软件也是是非非常多的。可是需要自身去改动里的编码,这样比较麻烦,还不如自身来一句一句地写呢。实际上,完成起耿也并不是那末的难。

思路:就是在wordpress主题的检索框中每键入一个标识符时,就要开启一个恶性事件——向数据信息库推送恳求——检索这个键入的标识符有关的信息内容。

这里会用到 电脑键盘按下弹起恶性事件,用到ajax推送恳求。很少说,按流程来。

第一步:wordpress主题检索框编码:

 div id="search" 
 form role="search" method="get" action="" 
 input type="search" id=" ?php echo $unique_id; ? " value="" name="s" / 
 ul /ul !-- 这里储放往下拉目录-- 
 button type="submit" search /button 
 /form 
 /div 

第二步:解决往下拉的JS编码:

//依据键入框中的恶性事件来做的事儿 应用keyup来分辨是不是要推送恳求,应用keyup在键入完词之后就会马上推送恳求

var now=-1; //申明一个自变量值为-1,是以便在应用左右键的情况下纪录li的序号

var resLength=0; //这个自变量是以便存li的长度

$('.search-field').keyup(function(event){

if(event.keyCode==38 || event.keyCode==40){ //每按一次左右键都会推送一次恳求,因此要先

return; //消除一边恳求

};

var ss = $('.search-field').val();

if( ss != '' ){ //当键入框的值不为空的情况下才可以推送恳求

$.ajax({

type:"post",

url:" ?php echo THEME_PATH; ? /search_get.php", //插口文档。这里的 THEME_PATH是我申明的一个变量定义:当今主题相对路径

async:true,

data:{ ss:ss, act:'dropdown_list''},

var arr = eval(res);

<(""); //先清空ul里的內容

for(var i=0;i arr.length;i++){

resLength=arr.length;

var title = arr[i].post_title;

title = title.replace(ss,' span '+ss+' /span

oli_i=$(' li '+ title +' /li

$('#search ul').append(oli_i);

//ess里边设定

$('#search ul li').eq(i).click(function(){

$('.search-field').val($(this).text());

$(this).addClass('current').siblings().removeClass('current')

})

};

$('#search ul').slideDown(); //显示信息往下拉

},

error:function(res){

console.log(res)

涵数) WordPress网站前台接待客户头像管理权限设定 WordPress网站后台管理的导航栏栏目详细介绍(掌握wordpress栏目) ---------

网站建设的基本准则

------------
<
>

 
QQ在线咨询
售前咨询热线
18720358503
售后服务热线
18720358503
返回顶部