我有一个/a html页面,它使用ajax加载另一个html页面,而不需要刷新页面,而且它似乎工作得很好。这里的问题是,每当加载ajax页面时,当调用两次for函数时,它都会导致for fire中的webpack函数
HTML代码
<html lang="en" class="page"><head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://unpkg.com/boxicons@2.0.7/css/boxicons.min.css" rel="stylesheet">
<link rel="stylesheet" href="index.css">
<title>Document</title>
</head>
<body id="home" style="">
<div id="homePage" class="home">
<div class="reg">
<i class="bx bxs-book-add"></i><span>Jobs</span>
</div>
</div>
<script src="./js/jquery.js"></script>
<script src="build.js"></script>
<script>
$(".reg").click (function() {
$.ajax({
url: "jobs.html",
success: function(data,status,jqXHR) {
$("#home").html($(data).filter(".main_body,script"));
history.pushState(null, null, "jobs.html");
}
});
});
</script>
</body></html>第二个HTML页面与上面的类似
<html lang="en" class="page"><head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://unpkg.com/boxicons@2.0.7/css/boxicons.min.css" rel="stylesheet">
<link rel="stylesheet" href="index.css">
<title>Document</title>
</head>
<body id="home" style="">
<div id="main_body" class="main_body">
<div class="reg">
<i class="bx bxs-book-add"></i><span>Home</span>
</div>
</div>
<script src="./js/jquery.js"></script>
<script src="build.js"></script>
<script>
$(".reg").click (function() {
$.ajax({
url: "index.html",
success: function(data,status,jqXHR) {
$("#home").html($(data).filter(".home,script"));
history.pushState(null, null, "/");
}
});
});
</script>
</body></html>webpack索引js文件
async function getAccount() {
const accounts = await ethereum.enable();
const account = accounts[0];
// do something with new account here
numberLoadeds++;
console.log("Time Called",numberLoadeds);
console.log("Changed to",accounts[0]);
}
ethereum.on('accountsChanged', function (accounts) {
getAccount();
});webpack配置文件
const path = require('path')
module.exports = {
mode : 'development',
entry: './client/index.js', // Our frontend will be inside the src folder
output: {
path: path.resolve(__dirname, 'public'),
filename: 'build.js' // The final file will be created in dist/build.js
},
inject: false,
devServer : {
contentBase: path.join(__dirname,'public'),
compress: true,
port:8085
}
}我怀疑的是,每次调用ajax函数来更改页面时,这些函数都会重复,但我不知道如何证明或识别这个问题。真的很需要帮助谢谢
发布于 2021-09-03 14:51:18
此问题与html文件相关。当jquery ajax函数被调用时,它发送div元素和不带script标记的脚本。当发送到浏览器时,它无法解释发送的脚本。然后,Jquery告诉浏览器对发送的脚本求值,导致重复。
解决方案实际上是将脚本标记移动到头部,并从ajax请求发送的数据中删除脚本过滤器。
https://stackoverflow.com/questions/68963450
复制相似问题