Javascript javascript将onclick链接到.js到文件

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5108139/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 15:41:50  来源:igfitidea点击:

javascript linking onclick to a .js to a file

javascriptbuttonclick

提问by Karl

I created a .jsfile, and then included it in the HTML pages by:

我创建了一个.js文件,然后通过以下方式将其包含在 HTML 页面中:

<script type="text/javascript" src="yourexternalfile.js"></script>

How do I call the function of the .jsfile using onclick = "...."?

如何.js使用调用文件的功能onclick = "...."

I know that it will be something like:

我知道它会是这样的:

<input type="BUTTON" value="Exit" onclick="javascript: ???;" >

but I can't figure it out...

但我想不通……

回答by Furqan Hameedi

If you are using JQuery, you can do it like this,

如果你使用的是 JQuery,你可以这样做,

       <input type="button" onclick="javascript: $.getScript('../scripts/yourfilepath' , function (){ youFunctionCall() ; } );" />

This will download the JS file when the button is cliked and shall execute the function called within.

这将在单击按钮时下载 JS 文件并执行其中调用的函数。

回答by Jeff Parker

Say your function was ...

说你的功能是...

function myFunction() {
    alert("hello!");
}

An example of the trigger would be ...

触发器的一个例子是......

<input type="button" onclick="myFunction(); return false;" value="Click me!" />

回答by alex

To call a function inside an external file, make sure the file is loaded first and then call it as per normal (so long as it exposes itself to the scope you need it to).

要在外部文件中调用函数,请确保首先加载该文件,然后按正常方式调用它(只要它向您需要的范围公开自己)。

回答by Pankaj Kumar

include the external java script file in your page(preferably in the head tag) using

使用

<script type="text/javascript" src="yourexternalfile.js"></script>

and then you can call any function defined in the js file

然后你可以调用js文件中定义的任何函数

回答by Abhi

use <script type="text/javascript" src="">to import the js file inside your page.

用于<script type="text/javascript" src="">在您的页面中导入 js 文件。

回答by Yuriy Nemtsov

Knowing when a JS file is (a) loaded, and (b) done executing is tricky, as it isn't supported by all browsers.

了解 JS 文件何时 (a) 加载,以及 (b) 执行完毕很棘手,因为并非所有浏览器都支持它。

I believe you're thinking something along the lines of:

我相信您正在思考以下问题:

var s = document.createElement("script"),
    f = document.getElementsByTagName('body')[0];
s.type = 'text/javascript';
s.src = "https://ajax.googleapis.com/ajax/libs/dojo/1.5.0/dojo/dojo.xd.js";

s.addEventListener("load", function() {
   console.log("script loaded");
});

f.appendChild(s);

Like I've mentioned above, it won't work for all browsers. And even if it does, it won't be very useful to you if you're actually trying to execute some code based on the JS that is pulled-in dynamically.

就像我上面提到的,它不适用于所有浏览器。即使它确实如此,如果您实际上尝试基于动态引入的 JS 执行一些代码,它对您也不会很有用。

The only reliable way to execute something when a dependency is loaded is to wrap that dependency in a function. That way when the browser parses that JS it will execute that function, which will let you know that you can start using whatever it is that you wanted to bring in. This is exactly why JSONP works the way it works.

加载依赖项时执行某事的唯一可靠方法是将该依赖项包装在一个函数中。这样,当浏览器解析该 JS 时,它将执行该函数,这会让您知道您可以开始使用您想要引入的任何内容。这正是 JSONP 以这种方式工作的原因。

If this is what you want to do, take a look at RequireJS.

如果这是您想要做的,请查看RequireJS

回答by blankabout

Have you tried actually putting in the name of the function? Like onclick='myFunction()'

您是否尝试过实际输入函数名称?像 onclick='myFunction()'

回答by Pjarenee

I would suggest adding the on-click event in the JS file like so:

我建议在 JS 文件中添加点击事件,如下所示:

html:

html:

<input type="button" id="myButton"/>

JS file:

JS文件:

var myButton = document.getElementById('myButton');
        myButton.onclick = function(){myFunction()};

This way you can program the element from the Javascript file. Just put it in a function that you call on-load.

通过这种方式,您可以从 Javascript 文件中对元素进行编程。只需将它放在您在加载时调用的函数中即可。