提供zblog模板 emlog模板 dedecms模板的下載和仿站定制
當前位置:網站首頁 > 教程 > 網頁特效 > 正文

一個輸入框調用多個搜索引擎的js代碼

天興工作室 2019-08-17 網頁特效 565 0 評論


要實現的方法是這樣的:

一個輸入框調用多個搜索引擎的js代碼 js代碼 搜索引擎 網頁特效 第1張

一個輸入框輸入關鍵詞,可以調用多個搜索引擎搜索,實現代碼是如下:

<div class="search clearfix">
    <input type="text" name="q" id="bdcsMain" value="輸入關鍵詞搜索" onfocus="if (value =='輸入關鍵詞搜索'){value =''}" onblur="if (value ==''){value='輸入關鍵詞搜索'}" >
    <button class="search-bd" type="submit" onclick="window.open('https://www.baidu.com/s?wd='+document.getElementById('bdcsMain').value)">百度</button>
    <button class="search-tb" type="submit" onclick="window.open('http://ai.taobao.com/search/index.htm?pid=mm_你的淘寶pid&amp;key='+document.getElementById('bdcsMain').value)">淘寶</button>
    <button class="search-by" type="submit" onclick="window.open('http://cn.bing.com/search?q='+document.getElementById('bdcsMain').value)">必應</button>
</div>

再加上一段js代碼可以實現按回車鍵默認調用第一個搜索:

<script>
    $("#bdcsMain").keydown(function (e) {//當按下按鍵時  
        if (e.which == 13) {//.which屬性判斷按下的是哪個鍵,回車鍵的鍵位序號為13  
            $('button.search-bd').trigger("click");//觸發搜索按鈕的點擊事件  
        }  
    });  
</script>

css效果可以根據自己需求寫,搜索引擎數量也沒啥限制。

沒有找到解決你問題的教程?

您可以試著搜索一下或者直接在線提問。我們也提供收費技術支持,有需要可以在線聯系我們。

在線提問 在線客服

取消回復歡迎 發表評論:

  • 請填寫驗證碼
  • 最新文章
  • 熱文排行
  • 最多評論
標簽聚合
×57zblog模板×33zblog×27zblogphp×20zblogphp模板×18天興工作室×16阿里云×12dedecms×11電子券×11ytcms×11zblog企業模板×10天興互聯×10zblog插件×9隨意打×9模板×9zblog安裝×9zblogphp1.5×9zblog錯誤×8天興通訊×8刷機×8企業模板

請登錄

社交賬號登錄

將本文分享給你的朋友們

千炮捕鱼电玩城外挂