Javascript中的全局variables跨多个文件
我的一些JavaScript代码位于名为helpers.js的外部文件中。 在调用这个JavaScript代码的HTML里面，我发现自己需要知道helpers.js中的某个函数是否被调用过。
我试图通过定义来创build一个全局variables：
var myFunctionTag = true; 在全球范围内，在我的HTML代码和helpers.js。
下面是我的HTML代码的样子：
<html> ... <script type='text/javascript' src='js/helpers.js'></script> ... <script> var myFunctionTag = false; ... //I try to use myFunctionTag here but it is always false, even though it has been se t to 'true' in helpers.js </script>
我正在努力做甚至可行吗？
您需要在包含helpers.js文件之前声明该variables。 只需在include for helpers.js之上创build一个脚本标签并在其中定义它。
<script type='text/javascript' > var myFunctionTag = false; </script> <script type='text/javascript' src='js/helpers.js'></script> ... <script type='text/javascript' > // rest of your code, which may depend on helpers.js </script>
该variables可以在.js文件中声明，只需在HTML文件中引用即可。 我的helpers.js版本：
var myFunctionWasCalled = false; function doFoo() { if (!myFunctionWasCalled) { alert("doFoo called for the very first time!"); myFunctionWasCalled = true; } else { alert("doFoo called again"); } }
和一个页面来testing它：
<html> <head> <title>Test Page</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <script type="text/javascript" src="helpers.js"></script> </head> <body> <p>myFunctionWasCalled is <script type="text/javascript">document.write(myFunctionWasCalled);</script> </p> <script type="text/javascript">doFoo();</script> <p>Some stuff in between</p> <script type="text/javascript">doFoo();</script> <p>myFunctionWasCalled is <script type="text/javascript">document.write(myFunctionWasCalled);</script> </p> </body> </html>
您将看到testingalert()会显示两个不同的东西，写入页面的值将会第二次不同。
好的，伙计们，这也是我的小testing。 我有一个类似的问题，所以我决定testing3种情况：
- 一个HTML文件，一个外部JS文件…它是否工作 – 可以通过全局variables函数进行通信？
- 两个HTML文件，一个外部的JS文件，一个浏览器，两个标签：他们会干涉通过全球变种？
- 一个由2个浏览器打开的HTML文件是否可以正常工作？
所有的结果都如预期的那样。
- 有用。 函数f1（）和f2（）通过全局var（var在外部JS文件中，而不是在HTML文件中）进行通信。
- 他们不干涉。 每个浏览器选项卡，每个HTML页面，显然都有不同的JS文件副本。
- 所有工作都是按照预期独立进行
而不是浏览教程，我发现它更容易尝试，所以我做了。 我的结论是：无论何时在HTML页面中包含外部JS文件，外部JS的内容在呈现页面之前都会“复制/粘贴”到HTML页面中。 或者如果你愿意的话进入你的PHP页面。 如果我在这里错了，请纠正我。 感谢名单。
我的示例文件如下：
外部JS：
var global = 0; function f1() { alert('fired: f1'); global = 1; alert('global changed to 1'); } function f2() { alert('fired f2'); alert('value of global: '+global); }
HTML 1：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <script type="text/javascript" src="external.js"></script> <title>External JS Globals - index.php</title> </head> <body> <button type="button" id="button1" onclick="f1();"> fire f1 </button> <br /> <button type="button" id="button2" onclick="f2();"> fire f2 </button> <br /> </body> </html>
HTML 2
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <script type="text/javascript" src="external.js"></script> <title>External JS Globals - index2.php</title> </head> <body> <button type="button" id="button1" onclick="f1();"> fire f1 </button> <br /> <button type="button" id="button2" onclick="f2();"> fire f2 </button> <br /> </body> </html>
我认为你应该使用“本地存储”而不是全局variables。
如果您担心在非常旧的浏览器中可能不支持“本地存储”，请考虑使用现有插件检查“本地存储”的可用性，如果不可用，请使用其他方法。
我使用了http://www.jstorage.info/ ，到目前为止我对此感到满意。
你可以创build一个json对象：
globalVariable={example_attribute:"SomeValue"};
在fileA.js中
并从fileB.js访问它，如： globalVariable.example_attribute
