Javascript 在 JQuery 中定义全局变量

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/37128205/
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 19:57:47  来源:igfitidea点击:

Define global variable in JQuery

javascriptjqueryglobal-variablesjquery-events

提问by Alicia

I'm not sure if I'm explaining this right, but here it goes ...

我不确定我是否正确地解释了这一点,但在这里......

I have a function that works in JQuery to assign the selected dropdown value to a variable and then pass the variable to a different part of the HTML when a confirmation button is clicked.

我有一个在 JQuery 中工作的函数,用于将选定的下拉值分配给一个变量,然后在单击确认按钮时将该变量传递给 HTML 的不同部分。

Here's a stripped down version of the HTML

这是 HTML 的精简版

<p id="t1"></p> 
<select id="selectLevel">
   <option value="1">1</option>
   <option value="2">2</option>
   <option value="3">3</option>
   <option value="4">4</option>
   <option value="5">5</option>
   <option value="6">6</option>
   <option value="7">7</option>
   <option value="8">8</option>
   <option value="9">9</option>
   <option value="10">10</option>
   <option value="11">11</option>
   <option value="12">12</option>
   <option value="13">13</option>
   <option value="14">14</option>
   <option value="15">15</option>
   <option value="16">16</option>
   <option value="17">17</option>
   <option value="18">18</option>
   <option value="19">19</option>
   <option value="20">20</option>
</select>
<span class="btn" id="confirmLevel">Confirm</span>

And here's the JQuery I used.

这是我使用的 JQuery。

$(document).ready(function() {
    $('#confirmLevel').click(function() {
        var PClevel = $("#selectLevel option:selected").text();
        $('#t1').append('Level ' + PClevel); 
    });
});

The problem is, if I later try to call the PCLevel variable for other functions, nothing happens. What am I missing here? Or would it be better to skip JQuery altogether and just use Javascript to do the same thing?

问题是,如果我稍后尝试为其他函数调用 PCLevel 变量,则没有任何反应。我在这里缺少什么?或者完全跳过 JQuery 并只使用 Javascript 来做同样的事情会更好吗?

回答by Joseph

The problem is that PClevelis scoped inside the click handler. It cannot be accessed outside. In order for code outside to see PClevel, declare it outside and have the click handler just modify it.

问题在于它PClevel的范围在点击处理程序内。它不能在外面访问。为了让外面的代码看到PClevel,在外面声明它并让点击处理程序修改它。

$(document).ready(function() {
    var PClevel; // Code inside the ready handler can see it.

    $('#confirmLevel').click(function() {
        PClevel = $("#selectLevel option:selected").text();
        $('#t1').append('Level ' + PClevel); 
    });
});

// or

var PClevel; // Now it's a global. Everyone can see it.
$(document).ready(function() {
    $('#confirmLevel').click(function() {
        PClevel = $("#selectLevel option:selected").text();
        $('#t1').append('Level ' + PClevel); 
    });
});

回答by DGS

Simply declare the variable on the global scope.

只需在全局范围内声明变量。

var PClevel = '';
$(document).ready(function() {
    $('#confirmLevel').click(function() {
        PClevel = $("#selectLevel option:selected").text();
        $('#t1').append('Level ' + PClevel); 
    });
});

It would be worth reading up on javascript scopes as they are relevant whether you are using jQuery or not.

阅读 javascript 范围是值得的,因为无论您是否使用 jQuery,它们都是相关的。

http://www.sitepoint.com/demystifying-javascript-variable-scope-hoisting/

http://www.sitepoint.com/demystifying-javascript-variable-scope-hoisting/

回答by Sajan Mullappally

Define PClevel as Global Variable var PClevel;and update the var on select change so you can access it across different functions.

将 PClevel 定义为全局变量var PClevel;并在选择更改时更新 var,以便您可以跨不同功能访问它。

$(document).ready(function() {
  var PClevel;
  PClevel = $("#selectLevel option:selected").text();
  $('#selectLevel').change(function(){
    PClevel = $("#selectLevel option:selected").text();
  });
  $('#confirmLevel').click(function() {
    $('#t1').append('Level ' + PClevel); 
  });
});

Plnkr Example : https://plnkr.co/edit/4KsLTahhq146ttwEcX8E?p=preview

Plnkr 示例:https://plnkr.co/edit/4KsLTahhq146ttwEcX8E ?p =preview

Updated Plnkr with multiple functions

更新了具有多种功能的 Plnkr

回答by deepak raghuwanshi

We can use window object, and set the variable on this window object as:

我们可以使用 window 对象,并将这个 window 对象上的变量设置为:

window.PClevel = 'value'