百度搜索框代码，实现回车点击，跳转到新页面，简单

参考网站：https://110.nanshiw.com/

 

上图为实现效果

代码如下：

<script>
function butClick() {
    var val = document.getElementById("search_key").value;
        if(val.length === 0){
                alert('搜索为空，请输入内容');
                return false;
        }else{
                var open_url = "https://www.baidu.com/s?ie=utf-8&wd=" + val;
                window.open(open_url); 
        }
}
document.onkeydown = function (e) {
    var theEvent = window.event || e;
    var code = theEvent.keyCode || theEvent.which || theEvent.charCode;
    if (code == 13) {
        butClick();
    }
}
</script>
<div class="layui-clear"> 
<a href="" class="baidulogo" target="_blank"> <img src="/www_moban_kim-images/bd_logo.png"></a>
<input type="search" id="search_key">
<a class="btn" target="_blank"  href="javascript:void(0)" onclick="butClick();">百度一下</a> </div>

 

上面代码简单解释一下，其中下面代码

<script>
function butClick() {
    var val = document.getElementById("search_key").value;
        if(val.length === 0){
                alert('搜索为空，请输入内容');
                return false;
        }else{
                var open_url = "https://www.baidu.com/s?ie=utf-8&wd=" + val;
                window.open(open_url); 
        }
}
document.onkeydown = function (e) {
    var theEvent = window.event || e;
    var code = theEvent.keyCode || theEvent.which || theEvent.charCode;
    if (code == 13) {
        butClick();
    }
}
</script>

js获取到表单的数据，把获取到的，数据和百度搜索URL拼接，然后直接跳转到百度

<div class="layui-clear"> 
<a href="" class="baidulogo" target="_blank"> <img src="/www_moban_kim-images/bd_logo.png"></a>
<input type="search" id="search_key">
<a class="btn" target="_blank"  href="javascript:void(0)" onclick="butClick();">百度一下</a> </div>

上面这段是样式，也就是开头最终实现的样子

这段代码中javascript:void(0)" οnclick="butClick(); 这个是不能变更的，如果你是大神，变更成什么样子，你可以自己来，我不是大神，建议不要更改

 

下面的代码是直接搜索，不跳转到新页面的

<script>
function butClick() {
    var val = document.getElementById("search_key").value;
        if(val == "" || val == null || val == 'undefined'){
                alert('搜索为空，请输入内容');
                return false;
        }else{
           window.location.href = "https://www.baidu.com/s?ie=utf-8&wd=" + val;
        }
}
document.onkeydown = function (e) {
    var theEvent = window.event || e;
    var code = theEvent.keyCode || theEvent.which || theEvent.charCode;
    if (code == 13) {
        butClick();
    }
}
</script>
<div class="layui-clear"> 
<a href="" class="baidulogo" target="_blank"> 
<img src="/www_moban_kim-images/bd_logo.png"></a>
<input type="search" id="search_key">
<a class="btn" target="_blank"  href="javascript:void(0)" onclick="butClick();">百度一下</a> 
</div>

这个代码感谢大神：4414站长论坛：小千 ，个人主页https://www.4414.cn/home.php?mod=space&uid=10367，的无私解决问题，感谢感谢！