gpt4 book ai didi

javascript - 消除某个 javascript 方法的所有实例的抖动

转载 作者:行者123 更新时间:2023-12-03 08:03:34 29 4
gpt4 key购买 nike

我的应用程序中有一个 JavaScript 需要去抖。

页面相关html如下:

<li id="liRetailer_10"> 
<a href="javascript:;">
<label class="checkbox-list">
<input type="checkbox" id="retailer_10" value="MenuItem" class="taggable" onclick="doTaggableChange(this)">MenuItem</label>
</a>
</li>

有多个像这样的 li 元素,它们用于调用对数据库执行查询的函数。

我想在用户停止单击这些元素一段时间后执行该函数,否则每次单击都会调用该函数,从而不必要地减慢系统速度。

即:用户单击element1,然后立即单击element2,当前脚本执行两次。我希望该函数运行一次。

调用onclick的方法如下:

function doTaggableChange(e) {
var index = $(e).attr('id').indexOf('_');
var type = $(e).attr('id').substring(0, index);
var id = $(e).attr('id').replace(type + '_', '');
var val = $(e).val();
var data = {
id: $(e).attr('id'),
value: val
};
var checked = $(e).is(':checked');
if (checked) {
$('#tagsinput').tagsinput('add', data);
addFilter(type, id);
} else {
$('#tagsinput').tagsinput('remove', data);
removeFilter(type, id);
}
}

为此,我尝试了以下操作,假设每次使用 jQuery 单击“taggable”类的元素时都会添加去抖:

(function() {
var dprocess = $.debounce(process, 5000);
$('.taggable').click(function() {
dprocess();
});
}());

然而这并没有奏效。

我的问题是:如何全局消除此“doTaggableChangeScript”的所有实例?

最佳答案

您可以使用 underscore.js 中的 debounce http://underscorejs.org/#debounce如下

var doTaggableChange = _.debounce(function(e) {
alert("doTaggableChangeFired", e);
}, 300)

传递的函数将推迟其执行,直到自上次调用以来等待毫秒后。

var doTaggableChange = _.debounce(function(e) {
var index = $(e).attr('id').indexOf('_');
var type = $(e).attr('id').substring(0, index);
var id = $(e).attr('id').replace(type + '_', '');
var val = $(e).val();
var data = {
id: $(e).attr('id'),
value: val
};
var checked = $(e).is(':checked');
if (checked) {
$('#tagsinput').tagsinput('add', data);
addFilter(type, id);
} else {
$('#tagsinput').tagsinput('remove', data);
removeFilter(type, id);
}
}, 300);

关于javascript - 消除某个 javascript 方法的所有实例的抖动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34491377/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com