火狐控制台显示: XML 解析错误:语法错误 行 1,列 1:

来源:3-5 下拉菜单的按需加载

悄然于心

2019-04-26 01:27:17

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>站点导航</title>
<link rel="stylesheet" href="../css/reset.css">
<!-- <link rel="stylesheet" href="../css/common.css"> -->
<style>
body{
background-color: #eee;
}

/* dropdown */

.dropdown{
position: relative;
float:left;
}
.dropdown-toggle{
position: relative;
z-index: 2;
}
.dropdown-arrow{
display: inline-block;
/*background-repeat:no-repeat;*/
vertical-align: middle;
}
.dropdown-layer{
display: none;
overflow: hidden;
position: absolute;
z-index: 1;
}
.dropdown-left{
left:0;
right:auto;
}
.dropdown-right{
left:auto;
right:0;
}

/* menu-dropdown */

.menu .dropdown-toggle{
/*display: block;*/
height:100%;
padding:0 16px 0 12px;
border-left:1px solid #f3f5f7;
border-right:1px solid #f3f5f7;
}
.menu .dropdown-arrow{
/*width:8px;
height:6px;
background-image:url(../img/dropdown-arrow.png);*/
margin-left:8px;
}
.menu .dropdown-layer{
top:100%;
background-color:#fff;
border:1px solid #cdd0d4;
}
.menu-item{
display: block;
height:30px;
line-height: 30px;
white-space:nowrap;
padding:0 12px;
color:#4d555d;
}
.menu-item:hover{
background-color: #f3f5f7;
}
.menu-active .dropdown-toggle{
background-color: #fff;
border-color:#cdd0d4;
}
.menu-active .dropdown-arrow{
/*background-image:url(../img/dropdown-arrow-active.png);*/
}
.icon-triangle-down{
width:0;
height:0;
border:4px solid #535b62;
border-right-color:transparent;
border-left-color:transparent;
border-bottom:none;
}
.menu-active .icon-triangle-down{
border-top:none;
border-bottom: 4px solid #f11c1c;
}

@font-face {
font-family: "iconfont";
src: url('../font/iconfont.eot?t=1556027603322'); /* IE9 */
src: url('../font/iconfont.eot?t=1556027603322#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('font/data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAuEAAsAAAAAFMgAAAs1AAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCEaAqaCJU2ATYCJAM4Cx4ABCAFhG0HgTobjhGjopyQRpH9BbYNe5LJ5NyOIRASYzEKJkexAPc0BQCA4QYAwG0BAADgAyzgyqIFgue/uc/7hjOTZBEUoAJSfDxx0e6prWwtkZCV1YQKyFaYzRZ0bf8QbfMepcLqNwvUaQMG2Ngrhg8+8MQ/QzAXrJpFBOsu+Ac96bU/A9LxFGc+4HV2QJf0x7y+vOmskmZZfADHhdS0H15Inev02nT0zZVOVAFTONWL+FvN/5qr+6g0SxNUO5XUCO02/ye8/aEqDRKZSEh3+PzfcK0QIoQYCQX/f7/JhVWgT+x3HFYs6m/zdAgQ6ZUAWimpqAc0DJoUdDvGNAigsQxMga8Q0p3FpOkVO0tQ1+ZX4E7w+/KX8UEDhdXoM62exS1A+HJOB7Nt02Fj3e8uD1iZAw2MARiQV9aCJ3QExwIq2voaroN2PHWXcFJWVLqKVdfqW3Nr7fmEde8b3Bthn6WYnVgXCe2Ovb9joDFAxOLRJAqyB5LnUKs/vBzEoajcMI8ZKnjoCopEhIpIWKh0JDxUGUmWjkAk0F1AFKD7QFKNngVCQM8BYUCvAeFA3wJCgb6HSAQ4HVRO0r400Q1wAJhFAOwloD2OFXjCS6Z0BDuCPEtGfSX0Bloeg9fAAUN2eG0b0ZVUlWZj7AGUQiYs3QdhkboYTp4pHVEjWUaX2pAWFjeBfC1I1W23vl4nh2MB5wUYMMKIvP1Tz35/LSLAjl3qyIIyr7L/Zfkq+WYWC3zG/aTBovbuDF1LzGUTy2iorxk96g6IIfoi6NPvZ4T4l6kgoj5PLz51YUQbgrFBv8nxM56KVkHMI9cQ5zauXtfYJQJt4FgaDLCGjUdYuV0Uw8vmtRGEOygS20Wg7RjIsaiiO5GYJTPD48FNSbOvfVMPMrwxl10KLk31OfXOA6abC+u2xFf/HkiuDye+3uGiedstIClTCu/9MJ9l4zFXw8+gnr6yq53E4CSjcYRwdNQckgkyE1ZKBRIbiYzjnezGMWsiWghwbV/4pD4QSLzl93Mt4QN5fV7x5wr7/RI4jNPiEnZq8GaMCCIRAQL4K21tsEdxjI6DRCZIssZQe8RRNowrzvBoQi7nsj0q2QhxlXBZDsXtqJMhpJIlGJLjJeLgaFoYR22ETC4vicXqX83BUSCcg+r76sO/hwv32HzcGKKCpgMDMCzQfzO8CopAQ56KLji+F0mzIWS7YC/MZ/DtmAYGYKH67Euco9aIOhGEBGIoGpxeM/wn7blbn/ASx9qd5ziPPpVeAmJ008dX02wuk1dZYeNoTx+SScuY/GZkgcaBznFQG4mpxCLprVEKKyMpFvscpJb2XGbcUo0oj98THjMU7zp+qOtvukYMwoj+4n9I2/B494Q1Zo4WUZmZEVlqGkk6GfkD71tKh8bS0Uky8gLzSvDgq0TF96ZUjJD5VFCMcn8Z2fHApAKxMUXw8sBSCQdfLzkMcExaFdogHcx3rGg5L3fN41gkU5xHQyOlQve/DPHpn8D5NzeITvtdBOETd1S+gPWDlSHTHt5KHxGIMfCo9GUmlQrFSaaGZC6vr9z4JZXxMltyKXT//0tlW1qyEJfuQYeQfB99i0JtSBXSUBMDXTDCKfL65Hlre9VUZo5b25TOq9it3pCtitmxsGdtvUvn4JFF0qMZAzNu6Bdz3wujRcgeZ+TYwGN2Wcl578XLjuVHNR3L2DPzuYerOMxFpHPVRrkmW5Qpkvj4sqUi/y2ScGHi9V+lUplNlZjddxfWxUVdugSbW48IY+kqObQ1B6xJ8T8yLjtiY5YYfFVemI0R2eMeWXsdcc8UV6+P2LjEdz8y7vN7GNlQGDre65nHLbZXacPV5enVB6I4ke0NI67NTz0W44wN2/KjZQ3AEWSslftQK81cP43cO9ClVfFSQ21UmYR9wXFtDAiqx0x1GGIIV6esS4ACQ4aeNtaucFnX0tv+7710v1Va78Sap1kgXcCVvuAGzhd09OVLtcc9D/UNLQ8JfjwKLJb7kk5QBRmGTlKSEJL5XJIBVEk678+MOvovbpzCXHfU6USHnupKNBfmR+mzwQXBzBMBQ8/T5q1/NDK0j9BQAilabU2Q7d3oe/ZGKP5OJAUoKdDrR4Wuf0SbdyFg6IwTRgGoiNKzgTjBPBYUFuCg71CAQIp6WzvUoYUQGzjYaCOgHi5xfOZHv485n88GvtyD/Dj21ta4uINcX0DvAjbwB+k8fx6rto4N+S2qIPZK9s9KCa2tVWwv3oF38qftBiDkerE+LUANDSGQsJcQ8pVJJGQyudTUuHh5HS8Dk/1fH/eB5N2BVQleaYFpInSsX6zASxCoJ77qoAcnjPuHy+du5QiCzxJwovlQ7uiXI/Y0iKAwdMS7PWNnzHEn8TxhEewGzQHvpH/IyNeG5F8jn5VNkZ0lrw+m76GHoMCWbsOL0INWRtjKQGHOq8mbdubcBqHDtJfHpF15bNSRfKedrPIuqgrMMquVl1I2nU+Gpds7t60p2/R907/3d9/MKZmdo1i2zS6eEzGraA71Xpg7u2IOkHA7g5GLQ3bKqvnl1YLU6lTjwudrynYKJGn7eZhV0Tc3uSy7sm8O1Lg8OFVb6nZv7fyY4hqmuEBcW+7CEY0WTkpefy/qSAOPJGZfxN7Ytbf+fIGnwjPpXEOvrlukvqT6EdNbXGe5hI9Nqof6qa/t6lFiy5xo96TO4s6i8k2zqfQonypoZi4CKoyn3BDqmABRxnCpRdDsM5pCzzDxK/PysC+UFg+WTrSH2aVZ/Us9emX2lyask4AgZftyIBJCQyDvsmA5a/AMdBBh7D6IdmPyQaPzWB/ShHdY5xLvJpxr7h9pqV5LlzuJbSq8/JzpdhIMNmFOsDkXDi6qHQ/awtuA2RPYpWIHy8lyMAETfixnv/vnmA7GR9Yq1keGg+mUF9XNkDk2Ojd13EWORdzgIKfcqo1Osorp3CjW66tQWn4au8cDDn0o7t/n1sSdjxZT3GXzZe4UHllhCK6E9KYf8Xsb/HbdXQQaOgJSOa2GDleSmklGS1IBc8gIsrTOVOBOeyB8xXLPo+/m7KLlwcpnNXfvp5M+3i+5m658okXTRq/ZLWzzbNonKlrduO+dezZ7DW/NpkXcbL9ePGh1IPc6rOh6Sy4u57UHk7vfKrrbyP1KJMuToJFADxlc+QM1e2/nRyHEW5o72eielQA08gNqC44HneG+1+ZE3evu1gqho/+dE9p60XXhkSZ1XsP+Puglm++jrjYt76M+mIntx+ZPXKHg5v4L5I9ty8+TuUehGj4MuF4eUOhCgVnWiMMBsA/WKplZmv1YklWc0DZGyjsRlzzUUaeA6KyCmVVJo/tDMS2VFfNIpiUJUnh6gjSBPmAcx4IsickgR2A+KDJKYj7RxMwFMRkwYoQIEuptCFKUvIXa5ngOGjjeC7K0eqdx8BwuQZHt4YGZGBgYo9CMIha0BVZ2wpiKwNVutoURdq9FNVYDYpaqxWGNqLkVI3A4NSnl3CxBcdTchZ7WNg3fYlHDajNhhEvEMajBQMAmM6FDVZYkLZpM2cnJ6o3eJBVhBAyWmaEQFhO2BUypMyFGhYBTb27ByPx8LZSGlQHCXDDuIWEjlFkrbOewVElSKgAJhVcadyp9W7XR4LPIPDWYhpoRjGAlMg9lcBoIMJN9Lx2UikUSbYM6k2zJcj51VSppeMb4rlO8fRNq46Uo0WLEihMvQbLf+afJpZBS6vAXEcyEIYSrAdOitBYMwTsxXMPqwBADomMsFsLK6dISuEblcVsTVYSpk9xJWDswtxxpaKhLi+BdVgOGp6RSdZi1aR7dgHXHpUe1VrLFjGA43QY1tTk0KEVrRdQoRqZyHQYAAAA=') format('woff2'),
url('../font/iconfont.woff?t=1556027603322') format('woff'),
url('../font/iconfont.ttf?t=1556027603322') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
url('../font/iconfont.svg?t=1556027603322#iconfont') format('svg'); /* iOS 4.1- */
}

.icon {
  font-family: "iconfont" !important;
  font-size: 14px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class*="-active"] .dropdown-arrow{
transform:rotate(180deg);
-o-transform:rotate(180deg);
-ms-transform:rotate(180deg);
-moz-transform:rotate(180deg);
-webkit-transform:rotate(180deg);
}
.transition{
transition:all 0.5s;
-o-transition:all 0.5s;
-ms-transition:all 0.5s;
-moz-transition:all 0.5s;
-webkit-transition:all 0.5s;
}

.fadeOut{
opacity:0;
visibility: hidden;
}
.slideUpDownCollapse{
height:0 !important;
padding-top:0 !important;
padding-bottom:0 !important;
}
.slideLeftRightCollapse{
width:0 !important;
padding-left:0 !important;
padding-right:0 !important;
}
</style>
</head>
<body>

<div class="menu dropdown fl" data-active="menu">
<a href="###" class="dropdown-toggle link">我的慕多多<i class="dropdown-arrow icon transition">&#xe639;</i></a>
<ul class="dropdown-layer dropdown-left">
<!-- <li><a href="###" target="_blank" class="menu-item">已买到的宝贝</a></li>
<li><a href="###" target="_blank" class="menu-item">我的足迹</a></li> -->
</ul>
</div>

<script src="../js/jQuery.js"></script>
<script src="../js/transition.js"></script>
<script src="../js/showHide.js"></script>
<script src="../js/dropdown.js"></script>
<script>

$(".dropdown").on("dropdown-show",function(e){
$.getJSON("dropdown.json",function(data){
var $layer = $(this).find(".dropdown-layer"),
html = "";
// $layer.html();
$.getJSON("dropdown.json",function(data){
setTimeout(function(){
for(var i=0;i<data.length;i++){
html += "<li><a href='"+data[i].url+"' target='_blank' class='menu-item'>"+data[i].name+"</a></li>";
}
},1000)
})
})
})
$(".dropdown").dropdown({
css3:true,
js:true,
event:"clicgk",
delay:0
// animation:"slideUpDown"
// active:"menu"
});
</script>
</body>
</html>
//JSON
[
	{
		"url":"###",
		"name":"已买到的宝贝"
	},
	{
		"url":"###",
		"name":"我的足迹"
	}
]

我没发现JSON有语法错误呀。。

而且在Chrome上文字图片还可以显示,在火狐上就变成一些奇怪的东西了。。

写回答

2回答

好帮手慕星星

2019-04-26

同学你好,火狐浏览器报错是正常的,是访问json文件的原因,Chrome 浏览器不能直接访问json文件,需要在服务器下才能访问,而火狐浏览器可以直接访问,但是会报错,这个没有关系。

代码中的问题:

http://img.mukewang.com/climg/5cc2672f00015db413810522.jpg

自己可以测试下,祝学习愉快!

0

悄然于心

提问者

2019-04-26

JSON文件的注释是我在提问时加上去的

0

0 学习 · 14456 问题

查看课程