我试图连接三个文件rule.js，event.js，action.js利用进口和出口中的JavaScript。
in 的函数event.js将从浏览器获取数据，当 and 条件满足时，它将运行该函数，然后rule.js执行该操作。
// 规则.js
import{actionOne} from 'action.js';
var scrollAndTime = (function(){
return function(){
console.log(actionOne());
}
})();
export{scrollAndTime};// 事件.js
import { scrollAndTime } from 'rule';
var scrollPercentage = (function(){
var scrollRun = false; // This is for future use
if(!scrollRun){
return function(scroll){
console.log("I am Scroll.");
var height = document.documentElement,
body = document.body,
st = 'scrollTop',
sh = 'scrollHeight';
scrollRun = scroll;
var scrollPercent = (height[st]||body[st]) / ((height[sh]||body[sh]) - height.clientHeight) * 100;
return scrollPercent;
}
}
})();
var timeSpent = (function(){
var time = new Date();
var timeRun = false, // This is for future use
startTime = time.getTime();
if(!timeRun){
return function(){ // call this function by timeSpent()();
console.log("I am Time.");
return (new Date()).getTime() - startTime;
}
}
})();
// Handling and condition between scrollPercentage and timeSpent
var and=false;
addEventListener("click",function(){
if(!and){
var scrollAndTimeSpent=false;
if(scrollPercentage()>70 && timeSpent()>15000){
// this.alert("Executed!");
and=true;
scrollAndTimeSpent=true;
}
if(scrollAndTimeSpent){
// Tell rule engine that I have completed
// Execute this function.
scrollAndTime();
}
}
})// 动作.js
var actionOne = (function(){
return function(){
// Do the following things and return the required thing.
return "ActionOne done!";
}
})();
export{actionOne};// index.html - 这是使用这些 js 文件的页面。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<link rel="stylesheet" href="main.css">
<title>Rule Engine</title>
</head>
<body>
<script type="module" src="event.mjs"></script>
</body>
</html>现在，当我使用 type="module" 时，我得到了 (Access to Script at 'file:///Users/praveenkumarrana/Desktop/Projects/ruleengine/event.mjs' from origin 'null' has been Blocked by CORS policy : 无效响应。因此不允许访问源“空”。) 错误。
当我不使用它时，我得到 (Uncaught SyntaxError: Unexpected token { in Chrome.)错误。
从这一行，
file:///Users/praveenkumarrana/Desktop/Projects/ruleengine/event.mjs
我假设您是从文件系统运行此代码（不通过本地服务器）。由于 ES6 模块易于遵循同源策略，因此您无法在没有 CORS 标头的情况下从文件系统或跨源导入它们。本质上，您必须从服务器运行此代码或在浏览器中禁用同源（用于测试）。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句