Javascript 函数仅在调用它的最新元素上运行
我有一个在通用表上运行的函数,它不能是特定的,它需要能够在许多不同的表上运行。我遇到的问题是,它是否在同一页的多个表上运行。click事件触发得很好,但它们只对最终表中的check元素进行操作,而不是对它们应该处理的表中的check元素进行操作 代码如下:Javascript 函数仅在调用它的最新元素上运行,javascript,jquery,jquery-3,Javascript,Jquery,Jquery 3,我有一个在通用表上运行的函数,它不能是特定的,它需要能够在许多不同的表上运行。我遇到的问题是,它是否在同一页的多个表上运行。click事件触发得很好,但它们只对最终表中的check元素进行操作,而不是对它们应该处理的表中的check元素进行操作 代码如下: $parent = $table.parents('div.ibox').find('div.ibox-title'); $select_all = $parent.find('button.s
$parent = $table.parents('div.ibox').find('div.ibox-title');
$select_all = $parent.find('button.select_all');
$deselect_all = $parent.find('button.deselect_all');
$input_delete = $table.find('input.delete');
if ($table.find('input.delete').length >= 2) {
$select_all.removeClass('hidden');
} else {
$select_all.addClass('hidden');
$deselect_all.addClass('hidden');
}
$select_all.on('click', function(event) {
$input_delete.each(function() {
$(this).prop('checked', true).trigger('change');
$select_all.addClass('hidden');
$deselect_all.removeClass('hidden');
});
});
$deselect_all.on('click', function(e) {
$table.find('input.delete:checked').each(function() {
$(this).prop('checked', false).trigger('change');
$deselect_all.addClass('hidden');
$select_all.removeClass('hidden');
});
});
$table
是一个变量,包含运行函数的$('table')
元素,它被传递到函数中
只是想知道是否有人知道如何让单击元素在他们应该在的表中的复选框上触发,而不是在页面上的最终表上触发。假设除了实际的
函数someFunc(){
和关闭}
部分之外,没有从函数中省略任何代码,这些行:
$parent = $table.parents('div.ibox').find('div.ibox-title');
$select_all = $parent.find('button.select_all');
$deselect_all = $parent.find('button.deselect_all');
$input_delete = $table.find('input.delete');
…所有声明(或更新)全局变量。因此,在为几个不同的表运行函数之后,这些变量将继续引用最后一个表的元素
这些变量都应该用
var
声明,使它们成为函数的局部变量。然后,单击事件处理程序将引用它们自己的变量,而不是共享全局变量。(即使在包含函数完成后,单击处理程序也可以继续引用其包含范围中的局部变量,因为。)非常感谢,这为我做到了。令人惊讶的是,我以前从未遇到过全局变量和局部变量的问题,所以这对我来说是新的。谢谢你的时间和帮助,不客气。作为一般规则,始终使用var
(或更新的let
或const
)声明所有变量,包括全局变量(显然必须在任何函数之外声明),因为这让阅读代码的人很清楚,你是故意声明全局变量的,而不是无意中遗漏了应该是局部变量声明的var
。你也可以考虑使用,在这种情况下,意外的全局错误会抛出一个错误,这是一件好事,因为它可以帮助你立即发现错误。你每天都能学到新东西。非常感谢你的帮助。