I have dynamically created increment and decrement buttons for certain <input> html elements (specifically for numeric inputs), however I cannot for the life of me how to figure out how to bind an action through the plugin function.
I want to do it specifically this way as these arrows will be used on many different types of forms that minus and add values (eg %, money etc.) which affect certain visual elements.
The function looks around the lines of:
(function ($) {
$.fn.addIncrementArrows = function (min, max, interval, fastInterval, event) {
var input = this;
/*Other building things go here*/
var timeoutDownArrow;
var intervalDownArrow;
//clicking button down for 1 second fires '-' actions
$(this).parent().children(".downarrow").mousedown(function () {
timeoutDownArrow = setTimeout(function () {
intervalDownArrow = setInterval(function () {
changeValue(-fastInterval);
//how to do event here?
}, 90);
}, 750);
}).bind("mouseup mouseleave", function () {
clearTimeout(timeoutDownArrow);
clearInterval(intervalDownArrow);
});
};
}(jQuery));
Simply what I need to declare to make it have the arrows as follows:
formnamehere.addIncrementArrows(0, 100, 1, 5, event);
If it's possible: how could I bind an action to the button within .addIncrementArrows()?
So after a bit of research I came to a conclusion:
1 - Changed the function to run inside .addIncrementArrows() as a named run-time function:
var setSliderPercentage = function (percent) {
//do stuff here
}
2 - Pass the function into the plugin as a variable name
percentageForm.addIncrementArrows(0, 100, 1, 5, setSliderPercentage);
3 - Ran the passed function within the addIncrementArrows() plugin.
$.fn.addIncrementArrows = function (min, max, interval, fastInterval, event) {
var input = this;
if (max === false) max = Infinity; //infinity and beyond!
//Other stuff here
//make the it auto increment or decrement every 100ms when 'holding down' the button after 1 second
var timeoutUpArrow;
var intervalUpArrow;
$(uparrow).mousedown(function () {
timeoutUpArrow = setTimeout(function () {
intervalUpArrow = setInterval(function () {
changeValue(fastInterval);
//
if (typeof event != "undefined") event(input.val());
//
}, 90);
}, 750);
}).bind("mouseup mouseleave", function () {
clearTimeout(timeoutUpArrow);
clearInterval(intervalUpArrow);
});
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.