Javascript 如何为这个jquery增量插件编写函数?
我发现了一个很好的jquery增量脚本。增量部分可以接受一个函数,也可以只接受一个正则数。我希望以1到100之间的随机数增加。我将如何为此编写函数Javascript 如何为这个jquery增量插件编写函数?,javascript,jquery,Javascript,Jquery,我发现了一个很好的jquery增量脚本。增量部分可以接受一个函数,也可以只接受一个正则数。我希望以1到100之间的随机数增加。我将如何为此编写函数 $( document ).ready( function() { $( '.tick' ).ticker( { incremental : 1, delay : 1500, separators : true }); $(".comma-change").html("."); }); &
$( document ).ready( function()
{
$( '.tick' ).ticker(
{
incremental : 1,
delay : 1500,
separators : true
});
$(".comma-change").html(".");
});
<span class="tick">2,354,456</span>
但是我很难把它直接用在这上面
以下是插件的增量部分:
Tick = (function() {
function Tick(element, options) {
this.element = element;
if (options == null) options = {};
this.running = false;
this.options = {
delay: options.delay || 1000,
separators: options.separators != null ? options.separators : false,
autostart: options.autostart != null ? options.autostart : true
};
this.increment = this.build_increment_callback(options.incremental);
this.value = Number(this.element.html().replace(/[^\d.]/g, ''));
this.separators = this.element.html().trim().split(/[\d]/i);
this.element.addClass('tick-active');
if (this.options.autostart) this.start();
}
Tick.prototype.build_increment_callback = function(option) {
if ((option != null) && {}.toString.call(option) === '[object Function]') {
return option;
} else if (typeof option === 'number') {
return function(val) {
return val + option;
};
} else {
return function(val) {
return val + 1;
};
}
};
然后这一点:
Tick.prototype.tick = function() {
this.value = this.increment(this.value);
this.render();
return this.set_timer();
};
您可能需要更新增量脚本的源代码。但如果你幸运的话,你也许可以用一些诡计来对付 增量脚本可能有如下内容:
function(options) {
//...
currentValue += options.incremental;
//...
}
如果是这种情况,您可以在事后定期调整选项的值。增量的,如下所示:
var opts;
$( '.tick' ).ticker(opts = {
incremental : 1,
delay : 1500,
separators : true
});
setInterval(function () {
var min = 1, max = 100; //adjust min/max to suit your needs.
opts.incremental = Math.random() * (max - min) + min;
}, 500); //any number under 1500 is probably fine
这是一个有点黑客,但它可能会工作。可能比更新插件的代码更容易。如果它不起作用,您可能需要直接增强插件。您需要做的就是将函数语句转换为函数表达式。function语句定义名称并为其分配函数,而函数表达式是函数本身(匿名函数)
您可以将变量的值设置为如下函数
var random_generator = function(min, max) {
return Math.random() * (max - min) + min;
};
然后将对该函数(变量random_生成器)的引用作为增量传递给插件。或者您可以像这样内联函数定义:
$( '.tick' ).ticker({
incremental : function(currentValue) {
// currentValue really is the current value of the ticker
// this is because the code inside the ticker plugin, that triggers
// your function, will take care of passing it as a parameter in
return +currentValue + random_generator(1, 100);
},
delay : 1500,
separators : true
});
编辑:我不知道,你的函数有两个参数。。。这让整个事情变得复杂了一点。您可以将min和max硬编码到您的函数中(因为该函数由插件中的代码调用,并且您肯定不会得到任何参数),或者围绕它包装另一个匿名函数,它为我们提供了两个参数
最终编辑:我猜你正在使用这个插件?这个插件可以接受一个函数,该函数将在每个滴答声中调用,并在滴答声的当前值中传递。您必须提供新的值。我相应地更新了代码段。您需要直接更新增量脚本。。你有使用incremental
的代码吗?是的,将代码的增量部分添加到原始问题中这可能不起作用,因为incremental
几乎肯定不会作为函数调用,除非这是插件的内置功能。如果不是,这可能是一个值得添加的功能。我找到了他实际使用的插件,结果证明它可以处理函数。我用插件的实际代码编辑了我的答案。啊,好吧……把当前值传回去是我所缺少的。告诉函数当前值的最佳方法是什么?我可以做一些类似var current=$('.tick').html()的事情吗;我很难同时告诉JS最新版本的JS正在操作的东西!变量currentValue是您的当前值。详细回答:您不必自己获取值,因为它是作为参数提供给您的函数的。理解回调函数的一个困难是,您不知道传入的函数可以有多少个参数。因此,您依赖于文档或自己查找实现。您还可以只使用console.log参数(一个包含所有传入参数的伪数组)来快速查看。在这种情况下,文档说明,您可以期望一个参数,它将是当前值。顺便说一句,如果当前值是字符串,这就是如何将字符串转换为数字+“23.2”
$( '.tick' ).ticker({
incremental : function(currentValue) {
// currentValue really is the current value of the ticker
// this is because the code inside the ticker plugin, that triggers
// your function, will take care of passing it as a parameter in
return +currentValue + random_generator(1, 100);
},
delay : 1500,
separators : true
});