调起手机软键盘点击搜索按键后触发搜索功能 --- WeUi+在线演示
首先在html中的form表单中加上action=“#” js通过submit()触发即可,具体代码如下:
HTML:
<div class="weui-search-bar" id="searchBar"> <form class="weui-search-bar__form" action="#"> <div class="weui-search-bar__box"> <input type="search" class="weui-search-bar__input" id="searchInput" placeholder="搜索" required=""> <a href="javascript:" class="weui-icon-clear" id="searchClear"></a> </div> <label class="weui-search-bar__label" id="searchText"> <i class="weui-icon-search"></i> <span>搜索</span> </label> </form> </div>
JS:
//点击搜索之后再次搜索 $("form").submit(function(){ var keyword = $("#searchInput").val(); console.log(keyword); $.ajax({ url:"/index.php/App/search/searchUser", type:"post", dataType:"json", async:true, data:{keyword:keyword}, success:function(data){ console.log(data); //数据预处理 formateData(data.value.list,"username"); var htmlUsers = template("usersId",data); $(".content .users").html(htmlUsers); if(data.value.count==0){ $(".icon-box").css({ "display":"block" }); $(".weui-cells__title").css({ "display":"none" }) }else{ $(".icon-box").css({ "display":"none" }); $(".weui-cells__title").css({ "display":"block" }) }; //数据预处理方法 function formateData(data,key){ for(var i=0;i<data.length;i++){ var thisReg = eval("/"+keyword+"/g"); data[i][key] = data[i][key].replace(thisReg,"<span class='text-red'>"+keyword+"</span>") }; } } }) return false; });
                    
                
                
            
        
浙公网安备 33010602011771号