为具有绑定价值的多个事件编写相同的变量

时间:2016-08-01 03:02:35

标签: javascript jquery global-variables

假设我们有两个在多个事件中使用的变量。

但每个变量都取自事件本身的值。

例如

$('#el1').click(function() {
    var a = $('#inp').val(); //same as a below event
    var b = $(this).attr('for'); //same as b below event
    data = { c1 : a, c2 : b };
});

$('#el2').click(function() {
    var a = $('#inp').val(); // same as a above event
    var b = $(this).attr('for'); // same as b above event
    data = { f1 : a, f2 : b };
});

在上面为某些事件编写相同变量的代码中。 每个变量都具有相同的元素属性 将绑定不同的值,导致变量放入不同的事件。

你知道我们只需要一次写同一个变量。 没有在事件中两次使相同的变量。

那怎么办..?

1 个答案:

答案 0 :(得分:0)

如果要执行此操作,则需要使用全局变量。 This解释了javascript变量范围的规则。

通常,应谨慎使用全局变量,以避免在整个代码中混淆它们。此外,您想要做的事情也存在问题。

让我们先看看b。你认为它们是同一个变量。"但他们并不是:this在您的第一个事件中引用el1,并且在您的第二个事件中引用el2。因此,仅仅因为您使用相同的代码定义它们,它们就不会是相同的值。你需要将它们分开。

现在,假设您确实为a创建了一个全局变量,如下所示:

var a = $('#inp').val(); 

$('#el1').click(function() {
    var b = $(this).attr('for'); 
    data = { c1 : a, c2 : b };
});

$('#el2').click(function() {
    var b = $(this).attr('for'); // same as b above event
    data = { f1 : a, f2 : b };
});

执行此操作时,a将等于您声明变量的时间点inp元素的值。该值将由你发起click事件的时间,所以如果你不理解这一点,你将会很难找到错误。

如果你真的想,你可以做一个像这样的全局变量:

var a = $('#inp');

然后在你的处理程序中:

data = { c1 : a.val(), c2 : b }

这将有效,因为只要页面运行,对inp元素的引用将保持不变。但val()会发生变化,因此您无法将其包含在内。

虽然它确实节省了一些处理器工作以避免通过在变量中存储对该元素的引用来多次获取该元素,但您必须平衡该元素而不是为代码添加复杂性。开发开销可能比性能开销昂贵得多。 (如果那不是真的,没有人会使用jQuery,因为普通的旧javascript运行速度更快,占用的空间更少。)因此,我不建议您这样做。使用ab变量有意义的唯一原因是它使分配data变量的行更容易阅读。因此,最好将它们保留原样。

将DOM元素的属性存储到变量的最佳时间是,如果您在循环中引用它,并且当您在该循环中时它不会发生变化。在这种情况下,我会说这是最好的做法。