关于按钮提交跳转不了问题
视频只教了提示框点击提交,按钮提交跳转不了是出了什么问题
<div class="bg-div">
<div class="search_box">
<form action="" method="get" id="search_form">
<input type="text" class="search_text" name="q" id="search_input" autocomplete="off" value="" />
<input type="submit" class="search_button" id="searchButton" value="" />
</form>
</div>
</div>
<!-- 提示 -->
<div class="suggest" id="search_suggest" style="display:none;">
<ul id="search_result">
<li>搜索结果1</li>
<li>搜索结果2</li>
</ul>
</div>
<script>
$(function(){
$('#search_input').on('keyup',function(){
var searchText = $('#search_input').val();
$.ajax({
url: 'http://api.bing.com/qsonhs.aspx?type=cb&q='+searchText, //当前页地址。发送请求的地址。
type: 'get',
async:true, //默认值: true。默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。
dataType: 'jsonp',//预期服务器返回的数据类型
jsonp:'cb',//在一个 jsonp 请求中重写回调函数的名字
jsonpCallBack:'callback',
success:function(d){ //当请求之后调用
var d = d.AS.Results[0].Suggests;
var html = '';
for(var i=0; i<d.length; i++){
html+='<li>'+d[i].Txt+'</li>';
}
$('#search_result').html(html);
$("#search_suggest").show().css({
top:$("#search_form").offset().top+$("#search_form").height()+10,
left:$("#search_form").offset().left,
position:"absolute"
});
},
error:function (){ //在请求出错时调用
console.log("失败");
}
})
});
$(document).bind('click',function(){
$("#search_suggest").hide();
});
//提示框点击提交
$('#search_result').on('click','li',function(){
var keyword = $(this).text();
location.href = 'http://cn.bing.com/search?q='+keyword;
})
//按钮提交
$('#searchButton').on('click',function(){
var keytext = $('#search_input').val();
location.href = 'http://cn.bing.com/search?q='+keytext;
})
})
</script>