關于按鈕提交跳轉不了問題
視頻只教了提示框點擊提交,按鈕提交跳轉不了是出了什么問題
<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.+keyword;
? })
//按鈕提交 ?
$('#searchButton').on('click',function(){
? ? ?var keytext = $('#search_input').val();
? ? ?location.+keytext;
? })
}) ? ? ?
</script>
2022-03-26
謝謝親的支持,后面會推出更優秀的課程。$.getJSON("Data/sport.json",function(data){...});data是通過上述方式返回來的json格式的數據.index是遍歷時各項元素的索引號,自動獲取。