<!doctype html><html><head><meta charset="UTF-8"><title>Document</title><link rel="stylesheet" type="text/css" href="css/list1.css"> </head><body><div><div id="main-hover"><div class="sHoverItem"> <img src="images/spp.jpg"><span class="sIntro"><h2 id="goodId1">外套长裙1</h2><p>莺卡 两生花印花棉麻假两件外套,简单的花色,充满了夏日里的清新感</p> <i>¥</i><h3>29.9</h3><button>加入购物车</button></span> </div> </div></div> <form><input type="button" id="btn" value="加载更多"/></form> <script src="js/ajax.js"></script> <script src="js/jquery-1.11.3.js"></script><script> var oBtn=document.getElementById("btn") oBtn.onclick=function(){ ajax("json.json",function(date){ var oDate=JSON.parse(date); console.log(oDate) var str=""; var oDiv=$("#main-hover") for(var i=0;i<oDate.length;i++) { str+='<div class="sHoverItem">'+ '<img src=" '+oDate[i].src+' ">'+'<span class="sIntro">'+'<h2 id="goodId2">'+oDate[i].name+'</h2>'+'<p>'+oDate[i].bewrite+'</p>'+ '<i>¥</i><h3>'+oDate[i].price+'</h3>'+'<button>加入购物车</button>'+'</span>'+ '</div>' } oDiv.append(str); },function(){alert(0)}) } </script><!--js效果--><script src='js/sHover.js'></script><script src='js/fun.js'></script></body></html>
2 回答
Summy_qiang
TA贡献3条经验 获得超0个赞
我这边没有完整的代码不能帮你测试 就我现在发现的比较重要的两个问题:1.如果要用jquery一定要在所有js代码引入之前引入jquery文件,这里建议在头部第一个引入,不然在引入jquery之前js文件是不能使用jquery的(这个相信都知道吧);2.用jquery实现AJAX有6种方法,我看你这里的代码是想用一种比较接近原生的一种方法,他的语法是这样的$.ajax(options)不是单纯的ajax(),具体的其他方法和options的内容我就不再这里说了,你可以找一个jquery的手册或者上网搜一下。希望可以帮到你0.0
紫焰123
TA贡献41条经验 获得超9个赞
<script src="js/ajax.js"></script>
<script src="js/jquery-1.11.3.js"></script>
调换一下位置试试
添加回答
举报
0/150
提交
取消