只能使用webstorm打开,问就是不知道!离谱事件
- 好吧,其实我知道原因:跨域问题,一会儿我截屏证明
- 但是webstorm会自动在本地文件前添加localhost
- 网上大多方法我都试过,只有这个最实用,而且完全不影响项目放在线上
- 有其他方法的童鞋萌,也不要忘记分享一下哦!!!嘻嘻
- PS:本篇博客只能理解,粘代码运行不太行哦,文章末尾的参考博客也很可
<!DOCTYPE html>
<html xmlns=""><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title></title><script src=".0.2/jquery.min.js" type="text/javascript"></script>
</head>
<body><div class="products_lg"><!-- 通过模板字符串上传的json数据将放置在这个位置 -->
<div>
</body>
</html>
<script type="text/javascript" src="../lib/undescore.js"></script>
<script type="text/template" id="template"><% for(var i=0; i<data.length; i++){ %><div style="margin: 2px; width: 126px; float: left; height: 160px"><table border="0" cellpadding="0" cellspacing="0" width="1%"><tbody><tr><td><table bgcolor="#e9e9e9" border="0" cellpadding="3" cellspacing="1" width="100%"><tbody><tr><td bgcolor="#ffffff" height="106" width="130"><table bgcolor="#e9e9e9" border="0" cellpadding="0" cellspacing="0" width="100"><tbody><tr><td align="middle" bgcolor="#ffffff" height="100" valign="center" width="100"><span><a href="<%= data1[i].a_href%>"><img border="0" height="100" src="<%=data1[i].img_href%>" width="111" /></a></span></td></tr></tbody></table></td></tr></tbody></table></td><td valign="bottom"> </td></tr><tr><td colspan="2"><table border="0" cellpadding="0" cellspacing="2" width="100%"><tbody><tr><td align="middle" height="20"><span><a href="<%=data1[i].a_href%>"><%= data1[i].print_type%></a></span></td></tr><tr><td align="middle" height="20"></td></tr></tbody></table></td></tr></tbody></table></div><% } %>
</script>
<script type="text/javascript">function ajax_request(new_old) {$.ajax({url: "/json/products.json", // 存储json数据的文件,该目录可以改变type: "GET",dataType: "json",success: function(data) {// console.log(new_old)var temp = $("#template").html();var html = _.template(temp);var tep = html({data[0].products_lg})$(".products_lg").html(tep_lg);}})}
</script>
/json/products.json
文件[{"products_intro": [{"a_href": "./Products/P8CH3.html","img_href": ".././image/products/img.png","print_type": "普印力P8CH3"},{"a_href": "./Products/P8CH6.html","img_href": ".././image/products/img.png","print_type": "普印力P8CH6"},{"a_href": "./Products/P8CH8.html","img_href": ".././image/products/img.png","print_type": "普印力P8CH8"}, {"a_href": "./Products/P8PH3.html","img_href": ".././image/products/img.png","print_type": "普印力P8PH3"}, {"a_href": "./Products/P8PH6.html","img_href": ".././image/products/img.png","print_type": "普印力P8PH6"}, {"a_href": "./Products/P8ZH3.html","img_href": ".././image/products/img.png","print_type": "普印力P8ZH3"}]}]
参考: 通过ajax展示本地json数据,为什么显示跨域
如何将json数据渲染到页面上
本文发布于:2024-01-28 13:33:57,感谢您对本站的认可!
本文链接:https://www.4u4v.net/it/17064200427772.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
留言与评论(共有 0 条评论) |