1

我不擅长 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>

请指教...

4

1 回答 1

2

<!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>

于 2016-01-11T18:35:52.727 回答