[英]Define global variable in JQuery
我不确定我是否正确地解释了这一点,但在这里......
我有一个在 JQuery 中工作的函数,用于将选定的下拉值分配给一个变量,然后在单击确认按钮时将该变量传递给 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>
这是我使用的 JQuery。
$(document).ready(function() {
$('#confirmLevel').click(function() {
var PClevel = $("#selectLevel option:selected").text();
$('#t1').append('Level ' + PClevel);
});
});
问题是,如果我稍后尝试为其他函数调用 PCLevel 变量,则没有任何反应。 我在这里缺少什么? 或者完全跳过 JQuery 并只使用 Javascript 来做同样的事情会更好吗?
问题是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);
});
});
只需在全局范围内声明变量。
var PClevel = '';
$(document).ready(function() {
$('#confirmLevel').click(function() {
PClevel = $("#selectLevel option:selected").text();
$('#t1').append('Level ' + PClevel);
});
});
阅读 javascript 范围是值得的,因为无论您是否使用 jQuery,它们都是相关的。
http://www.sitepoint.com/demystifying-javascript-variable-scope-hoisting/
将 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 示例: https ://plnkr.co/edit/4KsLTahhq146ttwEcX8E ? p = preview
更新了具有多种功能的 Plnkr
我们可以使用 window 对象,并将这个 window 对象上的变量设置为:
window.PClevel = 'value'
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.