我不擅长javascript、Ajax和;Jquery,但我仍然要完成一项任务。我正在尝试在运行时显示更新的记录计数。这将是实时报告供管理,数字应在不刷新页面的情况下更改。我试着写剧本,但还是失败了。在网上找到了一个jquery脚本,我修改了它,但我没有得到想要的结果,我得到了一个错误。我没有从谷歌搜索中找到一个有用的例子。如果你有任何支持或帮助的例子,请分享。
这就是我目前所做的:
CFC:计数器函数只运行一个循环,但实际上它将从数据库中获取数据。
<cfcomponent>
<cffunction name="counter" returntype="any" access="remote" >
<cfset var o= 1>
<cfloop index="b" from="1" to="1000">
<cfset o = b>
<cfset sleep = 1000>
</cfloop>
<cfreturn o>
</cffunction>
CFM文件:
<cfajaxproxy cfc="async" jsclassname="asyncjs" />
<!DOCTYPE html>
<html>
<body>
<div id="saa"><span class="count">200</span></div>
<div style="clear:both"></div>
<div id="talkbubble"><span class="count">1421</span></div>
<br />
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script type="text/javascript">
var objCfc = new asyncjs();
objCfc.setAsyncMode();
alert(objCfc.counter());
$('.count').each(function () {
var i =300;
$(this).prop('Counter',0).animate({
Counter: $(this).text()
}, {
duration: 4000,
easing: 'swing',
step: function () {
//$(this).text(Math.ceil(now)
$(this).text(i);
}
});
});
</script>
</body>
</html>
请告知。。。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>AJAX CFM</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
$('#noteDiv').load('content_notes.cfm?_=' +Math.random()).fadeIn("slow");
}, 1000); // refresh every 10000 milliseconds
</script>
</head>
<body>
<cfdiv id="noteDiv" bind="url:content_notes.cfm"></cfdiv>
</body>
</html>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<br>
...DIV Content - Date Time : <cfoutput> #now()# </cfoutput>
<br>
</body>
</html>