使用表格内容ID每10秒重新加载页面

时间:2018-06-11 19:41:38

标签: javascript jquery coldfusion

我有一张表,其中列出了客户及其ID。表格内容将发生变化(我从数据库加载数据)。

<table name="myCustomers">
    <thead>
        <tr><th>Name</th></tr>
    </thead>
    <tbody>
        <tr>
            <td>Name1</td>
            <input type="hidden" value="1" />
        </tr>
        <tr>
            <td>Name2</td>
            <input type="hidden" value="2" />
        </tr>
        <tr>
            <td>Name3</td>
            <input type="hidden" value="3" />
        </tr>
    </tbody>
<table>

我的网页名称是test.cfm 我希望,使用JavaScript或JQuery,每10秒刷新一次页面,但将输入隐藏值作为参数传递。例如,首先加载页面。然后,在10秒后,调用test.cfm?myID = 1 ... 10秒后,test.cfm?myID = 2,依此类推。

是否可以使用JavaScript或JQuery?

由于

3 个答案:

答案 0 :(得分:0)

尝试用JavaScript编写内容,每隔十秒从Web服务器获取数据,然后使用innerHTML将其打印到表中。从服务器获取数据的方法取决于当然的格式。

答案 1 :(得分:0)

// Gets any query string variable
function qs(variable) {
   var query = window.location.search.substring(1);
   var vars = query.split("&");
   for (var i=0;i<vars.length;i++) {
       var pair = vars[i].split("=");
       if(pair[0] == variable){return pair[1];}
   }
   return(false);
}

// Gets your specific query string variable and parses it as an int
function getQueryStringId() {
    var id = parseInt(qs("myId"), 10);
    return isNaN(id) ? 0 : id;
}

// Does the redirect/refresh after 10 seconds
function init() {
    var baseUrl = [location.protocol, '//', location.host, location.pathname].join('');
    var currentId = getQueryStringId();
    var nextId = currentId + 1;
    var nextUrl = baseUrl + "?myId=" + nextId;
    window.setTimeout(function () {
        window.location.href = nextUrl;
    }, 1000);
}

init();

答案 2 :(得分:0)

<html>
    <head>
        <script src="js/jquery-1.11.1.min.js"></script>
    </head>

    <body>
        <form>
        <table name="myCustomers">
    <thead>
        <tr><th>Name</th></tr>
    </thead>
    <tbody>
        <tr>
            <td>Name1</td>
            <input type="hidden"  value="12" />
        </tr>
        <tr>
            <td>Name2</td>
            <input type="hidden" value="24"/>
        </tr>
        <tr>
            <td>Name3</td>
            <input type="hidden" value="35" class="key1"/>
        </tr>
    </tbody>
    </form>
<table>

<script>
//use need to use cookie or session to keep track of page number
// create an array to  store all form values
var col=0;
    url();
    var pageno;
function url(){
            var values=[];
            $("input").each(function(){
                 // insert form value into array
                values.push($(this).val());
            });
                var length=values.length;
                    var x = document.cookie;
                    var t = x.replace("username=","");
                if(t==0){
                    document.cookie = "username="+0;    
                    pageno=values[0];
                    var addr=location.pathname+"?pageid="+pageno;
                    window.location.replace(addr);
                    t++;
                    document.cookie = "username="+t;

                }
                else if(t<length){
                    pageno=values[t];
                    t++;
                    document.cookie = "username="+t;
                    var addr=location.pathname+"?pageid="+pageno;
                    window.location.replace(addr);
                    setTimeout(url,5000);
                }
            else{
            document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC";
            }
}
</script>   
    </body>
</html>