需要把get()放到事件中才能体现ajax异步获取数据吗

需要把get()放到事件中才能体现ajax异步获取数据吗

源代码有小改动,效果实现了,就是代码写的不太好

// 搜索功能模块

(function(){

var searchData=null,

shoesData=null,

content=$(".commodityContainer").html();

// ajax获取json数据

$.get("./json/search.json",function(data){

searchData=data;

});

$.get("./json/basketballShoes.json",function(data){

shoesData=data;

});

// 输入框输入字符事件

$(".header-search-input").eq(0).on("input",function(){

for(var i in searchData){

if(this.value==searchData[i][0].Query){

var suggests=searchData[i][0].Results[0].Suggests;

for(var j in suggests){

var data="<li>"+suggests[j].Txt+"</li>";

$(".list").eq(0).append(data);

}

$(".list").eq(0).show();

break;

}

else{

$(".list").eq(0).html("").hide();

}

}

});

// 输入框键入回车事件

$(".header-search-input").eq(0).on("keydown",function(e){

if(e.keyCode=="13"){

for(var i in shoesData){

if(this.value==shoesData[i][0].Query){

$(".commodityContainer").html("");

var suggests=shoesData[i][0].Results[0].Suggests;

for(var j in suggests){

var data='<div class="mainCommodity"><div class="shopInfo"><div class="shopMsg"><input type="checkbox" name="shopMsg"id="shopMsg" class="shopMsg-input" autocomplete="off"><labelfor="shopMsg">店铺:<a href="#">'

+suggests[j].shop

+'</a></label></div></div><div class="commodityInfo"><ul><li class="td-chk"><div class="td-inner"><input type="checkbox" name="checkbox" autocomplete="off"></div></li><li class="td-item"><div class="td-inner"><a href="#" class="'

+suggests[j].label

+'"></a><div class="item-info"><div class="item-basis-info"><a href="#">'

+suggests[j].Txt

+'</a></div><div class="item-other-info"><div class="item-other-space"></div><div class="item-other-list"><a href="#" title="支持信用卡支付"><div class="bandCard"></div></a><a href="#" class="sevenDay" title="7天无理由"><div class="sevenDay"></div></a><a href="#" title="消费者保障服务"><div class="guarantee"></div></a></div></div></div></div></li><li class="td-info"><div class="td-info-msg"><p>'

+suggests[j].color

+'</p><p>'

+suggests[j].size

+'</p></div></li><li class="td-price"><div class="td-inner"><p class="non-discount">'

+suggests[j].nonDiscount

+'</p><p class="discount">¥<span>'

+suggests[j].num

+'</span></p><div class="promotion">卖家促销<i class="promotionIcon"></i></div><div class="proSlidedown"><p class="newPro">卖家促销:新品大特价</p><p>优惠:¥30.00</p></div></div></li><li class="td-amount"><div class="item-amount"><a href="#" class="amount-leftamount-color">-</a><input type="text" name="amountNum"value="1" autocomplete="off"><a href="#" class="amount-right">+</a></div><div class="stock">574</div><div class="outNum"><span class="instr">最多只能购买</span><span class="stockNum"></span><!----><em>件</em></div></li><li class="td-sum"><em>¥</em><!----><span>'

+suggests[j].num

+'</span></li><li class="td-operation"><p><a href="#" class="delete">删除</a></p></li></ul></div></div>';

$(".commodityContainer").append(data);

}

break;

}

else{

$(".commodityContainer").html(content);

}

}

}

})

})();

正在回答

登陆购买课程后可参与讨论,去登陆

2回答

同学你好,是执行send()才开始请求的。

如果同学对这块内容不理解的话,建议去看一下视频,了解一下。

如果帮助到了你,欢迎采纳~祝学习愉快~

好帮手慕言 2019-08-27 15:19:31

同学你好,默认设置下,所有请求均为异步请求。如果需要发送同步请求,要把async设置为 false。注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行(用户体验不好,所以一般都是使用异步的方式)。

Ajax请求有两种方式,GET和POST,同学可以去看一下视频,复习一下知识:https://class.imooc.com/course/800

项目作业完成之后,可以上传作业,批复作业的老师会针对同学上传的作业给出详细的指导和修改建议

如果帮助到了你,欢迎采纳~祝学习愉快~

  • 提问者 PHXL #1
    那么异步请求到底什么时候去请求数据的的呢?是在我输入搜索内容的时候去获取数据,还是页面加载的时候就获取到了数据呢?是在我调用send()方法的时候就开始异步获取了?
    2019-08-27 15:27:48
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
组件化思想开发电商网页 18版
  • 参与学习           人
  • 提交作业       467    份
  • 解答问题       4826    个

本路径带你通过系统学习HTML5、JavaScript、jQuery的进阶知识,不仅如此,还会学习如何利用组件化的思想来开发网页,知识点+案例,使得所学可以更好的得到实践。

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师