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

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

在 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;
       }
   }
}