php - WordPress 自定义搜索按钮

Question

我的 WordPress 博客中有一个自定义搜索表单，我的侧边栏中的文本小部件中有此搜索代码。

        <div class="search-form">
          <input type="text" value="" class="input-txt" id="search-txt"/>
          <input type="submit" value="Search" class="input-btn" id="idsubmit" onClick="search_redirect()"/>
          <script type="text/javascript">
              function search_redirect(){
                 text_val = document.getElementById('search-txt').value;
                 if(text_val!=''){
                   url_re = 'http://bizisearch.com/search?page=1&limit=20&engine=spider&type=web&query='+'"'+text_val+'"';
                     window.location = url_re;
                   } else {
                     alert('search input is required');
                   }
                   }    

   window.onload = function(){
   document.getElementById('testfield').onkeypress = function(e){
   if (!e) e = window.event;
   var keyCode = e.keyCode || e.which;
   if (keyCode == '13'){
     search_redirect();
     return false;
     }
    }
   }                            
            </script> 
        </div>

我希望搜索结果“在新选项卡中打开”，并且我可以按“ENTER”键进行搜索....

有教程或者你能指导我如何做到这一点吗？？？

谢谢

Answer 1

您无法控制如何在新选项卡中打开。可以通过捕获 Enter 键上的单击事件并在该事件中调用您的函数来完成输入。

在 JQuery 中输入事件:

$( document ).ready(function() {
    $('.input-btn').keydown(function (e){
        if(e.keyCode == 13){
             search_redirect();
        }
    })
});

如果未包含 JQuery，请确保包含它:或关注this guide以更好的方式包含它。

在纯 Javascript 中:(你应该给你的按钮一个 id)

window.onload = function(){
   document.getElementById('testfield').onkeypress = function(e){
       if (!e) e = window.event;
       var keyCode = e.keyCode || e.which;
       if (keyCode == '13'){
         search_redirect();
         return false;
       }
   }
}