当前位置: 首页 > 知识库问答 >
问题:

进出口报关单只能出现在模块的顶层[副本]

萧嘉茂
2023-03-14

我是一个新的网页编程,我尝试了一个非常简单的例子,以便了解它是如何工作的。

html file
<html>
<head>
<meta charset="ISO-8859-1">

<script type="text/javascript" src="/static/js/AddButton.js"></script>
<script type="text/javascript" src="/static/js/SendRequest.js"></script>

<title>{{title}}</title>


</head>
<body>

<button type="button" onclick="AddForm()"> + </button>

<div id = "newFormHere"></div>


<form action="javascript: SendFetchRequest()" id ="Form2">
    Ticker2:
        <input type="text" id="Ticker2" value="GOOG">
        <input type="submit" value="Submit">
        <div id = "FetchRequestOutput"></div>
</form>

</body>
</html>

我有一个向服务器发送请求的表单(form2)和一个向页面添加更多表单的按钮。

SendRequest.js (exporting functions)
export {SendFetchRequest}



function SendFetchRequest()
{
    var Ticker = document.getElementById("Ticker2");
    fetch("action_page" + "?Ticker=" + Ticker.value).then(function(response){
            response.text().then(function(data){
                    document.getElementById("FetchRequestOutput").innerHTML = data
            })

    })


}

在这里,我定义了希望附加到按钮的函数(我需要将其包含在addButton.js和html文件中)

AddButton.js  (importing functions)
import { SendFetchRequest } from '/static/js/SendRequest.js';

function AddForm()
{
    var myform = document.createElement("FORM");
    myform.setAttribute("id", Math.random());
    myform.setAttribute("type", "form");
    myform.action = "javascript: SendFetchRequest()";

    myinput = document.createElement("INPUT");
    myinput.setAttribute("type", "text");
    myinput.setAttribute("value", "SomeDefaultValue");

    mysubmit = document.createElement("INPUT");
    mysubmit,setAttribute("type", "submit");
    mysubmit.setAttribute("value", "Submit")

    myform.appendChild(myinput)
    myform.appendChild(mysubmit)

    document.getElementById("newFormHere").appendChild(myform)
};

这里是动态添加新按钮的代码。

我正在用flask+firefox64测试这段代码。我得到的错误是下面的一个。

SyntaxError: import declarations may only appear at top level of a module AddButton.js:6 
SyntaxError: export declarations may only appear at top level of a module  SendRequest.js:6.js:6 

我已经学习了本页上的第一个示例,如何在另一个JavaScript文件中包含一个JavaScript文件?

如果尝试使用“modules”

Loading failed for the module with source “http://127.0.0.1:5000/static/js/AddButton.mjs”.
Loading failed for the module with source “http://127.0.0.1:5000/static/js/SendRequest.mjs”.

客户端甚至无法加载脚本。

共有1个答案

常温文
2023-03-14

type=“text/JavaScript”应为type=“module”

请参阅此线程

 类似资料:
  • 我正在尝试使用GitHub上的一个名为“SimpleBar”的插件GitHub SimpleBar,但在下载脚本并查看simple.js脚本后,它似乎出现了一个错误“SyntaxError:import declarations Mays only Account at top level of a module” 在simplebar.js文件的顶部有一些导入代码行: 如果我在浏览器调试器中查看

  • 问题内容: 我的目标是使用Webpack将隔离的组件导出到假定的全局对象中。 index.html 在上面的示例中,我假设有一个全局对象/模块,该对象/模块的属性将附加其他模块。因此,我想将隔离的模块附加到全局对象,而又不破坏or 。 webpack.config.js src / main.jsx 我尝试将Webpack的值设置为每个可能的值(请参阅http://webpack.github.i

  • 我正在尝试使用模块。导出以创建“全局”函数,我可以在React项目中使用该函数使用Axios进行API调用。 我已经尝试了以下... 这将返回错误…'未定义fetchApi没有未定义 我知道,通常你可以使用导出默认导入和导出组件,但我认为这不是必需的,如果使用module.export. 另外,如果我尝试像这样导入。。。 我得到以下错误...尝试导入错误:'.../.../.../utils/ap

  • 我试图找到问题的解决方案,但找不到,正在寻找一些“最佳实践范例”。我有一个nodejs express应用程序,我的函数被拆分成文件。例如,我有一个控制器(oktacontroller.js): 在两个导出的函数(都是快速路由)中,我都需要var-okta_-api_键。我知道我可以通过在这两个函数中查询它们来获得它们,因为它们是异步函数,我可以在那里使用wait,但是每次查询都感觉很愚蠢(因为它

  • 我有这段代码显示了一个按钮谁显示一个弹出窗口,我希望用户能够关闭弹出窗口点击它的外部时,它是打开的。

  • 似乎当数据量变得太大时,Firebase会进入“只读”状态