作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试让这个 Jquery 计数功能正常工作,但它没有为我显示,有人可以告诉我我做错了什么吗?
我正在使用由“mhuggins”( https://github.com/mhuggins/jquery-countTo ) 创建的函数,所以我还没有自己制作它,只是想让它工作。
countup.js
(function($) {
$.fn.countTo = function(options) {
// merge the default plugin settings with the custom options
options = $.extend({}, $.fn.countTo.defaults, options || {});
// how many times to update the value, and how much to increment the value on each update
var loops = Math.ceil(options.speed / options.refreshInterval),
increment = (options.to - options.from) / loops;
return $(this).each(function() {
var _this = this,
loopCount = 0,
value = options.from,
interval = setInterval(updateTimer, options.refreshInterval);
function updateTimer() {
value += increment;
loopCount++;
$(_this).html(value.toFixed(options.decimals));
if (typeof(options.onUpdate) == 'function') {
options.onUpdate.call(_this, value);
}
if (loopCount >= loops) {
clearInterval(interval);
value = options.to;
if (typeof(options.onComplete) == 'function') {
options.onComplete.call(_this, value);
}
}
}
});
};
$.fn.countTo.defaults = {
from: 0, // the number the element should start at
to: 100, // the number the element should end at
speed: 1000, // how long it should take to count between the target numbers
refreshInterval: 100, // how often the element should be updated
decimals: 0, // the number of decimal places to show
onUpdate: null, // callback method for every time the element is updated,
onComplete: null, // callback method for when the element finishes updating
};
})(jQuery);
然后我尝试在这个 html 页面中使用它
test.html
<html>
<head>
<script type="text/javascript" src="scripts/jquery-1.6.2.js"></script>
<script type="text/javascript" src="scripts/countup.js"></script>
<script type="text/javascript"><!--
$('.timer').countTo({from: 0, to: 500});
//--></script>
</head>
<body>
<span class="timer"></span>
</body>
</html>
当我启动页面时,没有任何反应。该脚本正在为其他人工作,所以显然是我做错了。我对此很陌生,所以这并不奇怪。
谢谢!
最佳答案
看起来您缺少 document.ready(function() {//计时器代码 });
关于Jquery 函数没有显示,怎么回事?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11393320/
我是一名优秀的程序员,十分优秀!