通过脚本标签调用java脚本函数
[英]calling java script function via script tag
问题描述
when i try to load script and call functions present in my script it is showing as function is not defined.
当我尝试加载脚本并调用脚本中存在的函数时，它显示为未定义函数。 below is my html file下面是我的 html 文件
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors"> <meta name="generator" content="Jekyll v4.1.1"> <title>Magic Bricks</title> <!-- Bootstrap core CSS --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous"> <link rel="stylesheet" href="{{templateInfo.url}}/css/custom.css"> </head> <body> <nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark customTopBar"> <a class="navbar-brand navLogo" href="#">MAGIC BRICKS</a> <a class="nav-link loginLink ml-auto" href="#"> <img class='navProfileImage' src="{{templateInfo.url}}/images/userProfile.png" alt='profile' /> LOGIN </a> </nav> <main role="main" class="bgImage"> <div class="text-center col-md-12"> <h1 class="landingHeadingCss"> Properties for <strong>Sale </strong>in <strong>Hyderabad</strong> </h1> </div> <div class="landingSearchCard card"> <div class="d-flex mb-3"> <div class="activeSearchTab">Sale</div> <div class="searchTab ml-5">Rent</div> </div> <div class="input-group mb-3 customInput row mx-0"> <div class="input-group-prepend searchButton col-3 px-0"> <input type="text" class="form-control" value="" id="city" aria-describedby="basic-addon2"> </div> <input type="text" class="form-control col-auto" placeholder="Search for locality..." aria-label="Recipient's username" aria-describedby="basic-addon2"> <div class="input-group-append searchButton col-auto px-0"> <!-- <a class="input-group-text" href="{{templateInfo.url}}api/searchProperties?city=Hyderabad">Search</a> --> <button onclick="reload()" id="basic-addon2" class="input-group-text">Search</button> </div> </div> </div> </main> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script> <script type="application/json" src='../services/reload.service.js'></script> </body> </html>
and this is my reload.service.js这是我的 reload.service.js
import fetch from 'node-fetch'; import config from '../config/config'; const serverUrl = config.localUrl; function reload() { console.log(">>>>>>>>>>.") let url = serverUrl + "api/searchProperties"; fetch(url, { method: 'GET', headers: { "Content-Type": "application/javascript" } }).then(response => console.log(response)) } export { reload }
when i click on search button it is showing as reload is undefined.当我单击搜索按钮时，它显示为未定义重新加载。 How to resolve this如何解决这个问题
Any explaination is welcome and appreciated,Thanks in advance.欢迎和感谢任何解释，提前致谢。
1 个解决方案
解决方案1
2 2020-11-16 16:51:35
I think your error is here:我认为你的错误在这里：
script type="application/json" src='../services/reload.service.js'脚本类型="应用程序/json" src='../services/reload.service.js'
Why do you put "application/json" since you are importing a .js file ?既然要导入 .js 文件，为什么要放置“application/json”？
Make sure you have added ' script type = "application/javascript" , or nothing , because that should be the default value.确保您已添加 ' script type = "application/javascript" 或什么都没有，因为这应该是默认值。 I think the problem is with you export.我认为问题出在您的出口上。 I don't know which framework you are using .不知道你用的是哪个框架。 If it's pure javascript , you can remove this :如果它是纯 javascript ，您可以删除它：
export { reload }出口{重新加载}
As you are already importing the javascript file , all the functions are automatically imported.由于您已经在导入 javascript 文件，因此所有功能都会自动导入。 Please look at the screenshot this picture :请看这张图片的截图：
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.