WordPress自定义搜索按钮

时间:2013-07-09 06:05:32

标签: php javascript wordpress

我在我的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”键进行搜索....

是否有教程或是否可以指导我如何做到这一点?

由于

1 个答案:

答案 0 :(得分:1)

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

在JQuery中输入事件:

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

如果没有包含JQuery,请确保包含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;
       }
   }
}