I have an html table of yes/no (textual) like buttons, and the below JavaScript that passes the click-requests onto the server. I'm transforming this javascript, which manually prevents rapid-fire clicks:
var MILLS_TO_IGNORE_LIKES = 500;
var processLike = function() {
//In this scope, "this" is the button just clicked on.
//The "this" in processLikeInner is *not* the button just clicked on.
var $button_just_clicked_on = $(this);
//The value of the "data-color_id" attribute.
var color_id = $button_just_clicked_on.data('color_id');
var processLikeInner = function(data, textStatus_ignored, jqXHR_ignored) {
//alert("sf data='" + data + "', textStatus_ignored='" + textStatus_ignored + "', jqXHR_ignored='" + jqXHR_ignored + "', color_id='" + color_id + "'");
$('#toggle_color_like_cell_' + color_id).html(data);
//Don't process requests too close together:
console.log('Like disabled for: ' + MILLS_TO_IGNORE_LIKES);
setTimeout(function() {
$button_just_clicked_on.one('click', processLike);
console.log('Like re-enabled for color_id ' + color_id + ' ');
}, MILLS_TO_IGNORE_LIKES);
}
var config = {
url: LIKE_URL_PRE_ID + color_id + '/',
dataType: 'html',
success: processLikeInner
};
$.ajax(config);
};
$(document).ready(function() {
/*
There are many buttons having the class
td__toggle_color_like_button
This attaches a listener to *every one*. Calling this again
would attach a *second* listener to every button, meaning each
click would be processed twice.
When a button is clicked, the listener for that *single button*
is disabled. It's re-enabled in processLikeInner with
$button_just_clicked_on.one('click', processLike);
*/
$('.td__toggle_color_like_button').one('click', processLike);
});
to this version that uses Underscore. What should "data" (the variable in html(data)) be changed to?
var MILLS_BTWN_LIKES = 500;
$(document).ready(function() {
/*
There are many buttons having the class
td__toggle_color_like_button
This attaches a listener to *every one*. Calling this again
would attach a *second* listener to every button, meaning each
click would be processed twice.
When a button is clicked, the listener for that *single button*
is disabled. It's re-enabled in processLikeInner with
$button_just_clicked_on.one('click', processLike);
*/
$('.td__toggle_color_like_button').click(_.debounce(function(e){
colorId = $('.td__toggle_color_like_button').data('color_id');
//console.log("colorId='" + colorId + "'");
$('#toggle_color_like_cell_' + colorId).html(data); //<-- here
}, MILLS_BTWN_LIKES));
});
Aucun commentaire:
Enregistrer un commentaire