访问更改方法之外的更改方法中更改的变量值?

时间:2015-02-03 03:37:30

标签: javascript function variables onchange

之前我曾尝试过询问此类问题,但我不明白我想做什么是可能的。当事情发生变化时,例如更改选择下拉列表或选中复选框或取消选中复选框时,可以将这些值放在全局变量中,以便稍后在代码中使用这些值     例如,我想做这样的事情

var amountChosen;

$('#amountItems').change(function(){
            amountchosen = $('#amountItems option:selected').val();
            alert(amountchosen)
});

所以我希望amountChosen的值在更改方法中改变,因为我知道它的工作方式,但我不会将其应用于全局变量。

因为我想在另一个函数内部做这样的事情

if(amountChosen == 2){
    do this
}
if(amountChosen == 3){
    do this
}
etc.

我永远无法获得改变方法之外的值,这是一个很大的问题。

如果我的代码中有一些位置,我需要提供一些信息,例如用户选中此信息以及他选择的项目数量。据我所知,我必须在.change方法或.is('checked')中完成所有这些操作。如何使更改的变量在远离代码的函数的参数中可用。

总结一下。我根据状态做了不同的功能做不同的事情(我猜它叫做那个)。我在函数中获取更新状态时遇到问题,因此我可以根据状态进行操作

3 个答案:

答案 0 :(得分:1)

您可能希望使用事件发射器或pub-sub系统进行探索。由于您已经在使用jQuery,因此很容易创建自己的发射器。

$emitter = $({});

function foo() {
  $('#amountItems').change(function(){
    var amountchosen = $('#amountItems option:selected').val();
    $emitter.trigger('amountUpdate', amountchosen);
  });
}

function bar() {
  $emitter.on('amountUpdate', function(e, amount){
    // do something with the amount
  });
}

这使您处于两种功能都需要在其范围内具有事件发射器的情况,但是发射器可以是许多未耦合或松散耦合的组件之间相互通信的通道。

答案 1 :(得分:0)

您不需要做任何特别的事情:如果您使用已定义的变量"外部"函数的作用域,创建一个闭包,函数将保持对变量的引用。这么多函数可以引用同一个变量。

例如代码中的代码非常高(如全局级别):

// At the top of your main file.js
var myVar = initialValue;

// somewhere deeper into the code (getter)
function one() {
  if (myVar === something) { ... }
}

// Somewhere else like from another file (setter)
function two() {
  myVar = something;
}

如果您无法访问myVar中的某个功能,则表示您没有足够高地声明myVar。当我说" high"时,我正在考虑范围层次结构:

// global level, very high
var rootVariable;

function toto() {
  // toto level, has access to rootVariable
  var totoVar;
}

function tutu() {
  // tutu level, has access to rootVariable but not totoVar
  var tutuVar;
}

如果我误解了您的问题或者仍然无法解决问题,请尝试创建一个可以重现您问题的jsfiddle。

答案 2 :(得分:-1)

一个非常简单的解决方案是简单地将值保存在某处,然后再查找:

<input type="text" id="amountItems" data-amount-chosen="0">

$('#amountItems').change(function(){
    amountchosen = $('#amountItems option:selected').val();
    $('#amountItems').data("amount-chosen", amountchosen);
    alert(amountchosen);
});

// somewhere later...
var amountchosen = $('#amountItems').data("amount-chosen");
if(amountChosen == 2){
    do this
}
if(amountChosen == 3){
    do this
}
etc.

请注意,我们只是更改了html标记以添加数据元素,在那里保存了正确的数据,然后在我们需要时再次查找它。