多个 JS 文件中的 JQuery 和变量

JQuery and Variables in Multiple JS files

本文关键字:JQuery 变量 JS 文件 多个      更新时间:2023-09-26

我有引用html ID的变量,例如

<div data-role="footer" id="ftrPaxFlight">
    <h4>&#169; 2012, BT</h4>
</div>

我正在使用jQuery在html中嵌入一个javascript,就像

<script>
  $(document).ready(function() {
            var ftrPaxFlight = $('#ftrPaxFlight');
    var butMainLogin = $('#butMainLogin');
    var butMainSetup = $('#butMainSetup'); 
       .....
      butMainLogin.bind("click", function() {
           getChangeFtr();
    });

其中getChangeFtr是位于外部.js文件中的函数。我想将逻辑与 UI 分开。此文件也包含在标签下

function getChangeFtr(){
     alert("Ftr will be changed " + ftrPaxFlight);
 }

当单击按钮时..调用方法getChangeFtr(),我收到错误

TypeError - ftrPaxFlight 未定义。

有人可以指导我使用jQuery将变量传递给多个javascript文件的正确方法吗?

有很多方法可以做到这一点,但没有"正确的方法"。您可以使用全局变量、全局命名空间/单例,或者只是使用参数在函数之间传递对象。在您的情况下,我会使用参数:

function getChangeFtr( elem ){
    alert("Ftr will be changed " + elem);
}

和:

butMainLogin.bind("click",function() {
    getChangeFtr( ftrPaxFlight );
});

您的 ftrPaxFlight 变量在文档就绪函数的作用域内声明。您需要在全局范围内声明它,以便全局方法访问该变量。

var ftrPaxFlight;
$(document).ready(function(){
    ftrPaxFlight = $('#ftrPaxFlight');
    //....etc
}
function getChangeFtr(){
    alert("Ftr will be changed " + ftrPaxFlight);
}

使用

var ftrPaxFlight = $('#ftrPaxFlight').val()

并声明

<script>
var ftrPaxFlight;
$(document).ready(function() { .......

作为全局就绪前功能。