ajax poller

Ajax poller
Copyright (C) 2006 DTHMLGoodies.com, Alf Magne Kalleland
This library is free software; you can redistribute it and/or
modify it under the terms of the GNU Lesser General Public
License as published by the Free Software Foundation; either
version 2.1 of the License, or (at your option) any later version.
This library is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
Lesser General Public License for more details.
You should have received a copy of the GNU Lesser General Public
License along with this library; if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
Dhtmlgoodies.com., hereby disclaims all copyright interest in this script
written by Alf Magne Kalleland.
Alf Magne Kalleland, 2006
Owner of DHTMLgoodies.com


代码如下:

var serverSideFile = 'ajax-poller-cast-vote-php.php';
var voteLeftImage = 'images/graph_left_1.gif';
var voteRightImage = 'images/graph_right_1.gif';
var voteCenterImage = 'images/graph_middle_1.gif';
var graphMaxWidth = 130; // It will actually be a little wider than this because of the rounded image at the left and right
var graphMinWidth = 15; // Minimum size of graph
var pollScrollSpeed = 5; // Lower = faster
var useCookiesToRememberCastedVotes = false; // Use cookie to remember casted votes
var txt_totalVotes = 'Total number of votes: ';
var ajaxObjects = new Array();
var pollVotes = new Array();
var pollVoteCounted = new Array();
var totalVotes = new Array();
/* Preload images */
var preloadedImages = new Array();
preloadedImages[0] = new Image();
preloadedImages[0].src = voteLeftImage;
preloadedImages[1] = new Image();
preloadedImages[1].src = voteRightImage;
preloadedImages[2] = new Image();
preloadedImages[2].src = voteCenterImage;
/*
These cookie functions are downloaded from
http://www.mach5.com/support/analyzer/manual/html/General/CookiesJavaScript.htm
*/
function Poller_Get_Cookie(name) {
var start = document.cookie.indexOf(name+"=");
var len = start+name.length+1;
if ((!start) && (name != document.cookie.substring(0,name.length))) return null;
if (start == -1) return null;
var end = document.cookie.indexOf(";",len);
if (end == -1) end = document.cookie.length;
return unescape(document.cookie.substring(len,end));
}
// This function has been slightly modified
function Poller_Set_Cookie(name,value,expires,path,domain,secure) {
expires = expires * 60*60*24*1000;
var today = new Date();
var expires_date = new Date( today.getTime() + (expires) );
var cookieString = name + "=" +escape(value) +
( (expires) ? ";expires=" + expires_date.toGMTString() : "") +
( (path) ? ";path=" + path : "") +
( (domain) ? ";domain=" + domain : "") +
( (secure) ? ";secure" : "");
document.cookie = cookieString;
}
function showVoteResults(pollId,ajaxIndex)
{
document.getElementById('poller_waitMessage' + pollId).style.display='none';
var xml = ajaxObjects[ajaxIndex].response;
xml = xml.replace(/\n/gi,'');
var reg = new RegExp("^.*?<pollerTitle>(.*?)<.*$","gi");
var pollerTitle = xml.replace(reg,'$1');
var resultDiv = document.getElementById('poller_results' + pollId);
var titleP = document.createElement('P');
titleP.className='result_pollerTitle';
titleP.innerHTML = pollerTitle;
resultDiv.appendChild(titleP);
var options = xml.split(/<option>/gi);
pollVotes[pollId] = new Array();
totalVotes[pollId] = 0;
for(var no=1;no<options.length;no++){
var elements = options[no].split(/</gi);
var currentOptionId = false;
for(var no2=0;no2<elements.length;no2++){
if(elements[no2].substring(0,1)!='/'){
var key = elements[no2].replace(/^(.*?)>.*$/gi,'$1');
var value = elements[no2].replace(/^.*?>(.*)$/gi,'$1');
if(key.indexOf('optionText')>=0){
var pOption = document.createElement('P');
pOption.className='result_pollerOption';
pOption.innerHTML = value;
resultDiv.appendChild(pOption);
}
if(key.indexOf('optionId')>=0){
currentOptionId = value/1;
}
if(key.indexOf('votes')>=0){
var voteDiv = document.createElement('DIV');
voteDiv.className='result_pollGraph';
resultDiv.appendChild(voteDiv);
var leftImage = document.createElement('IMG');
leftImage.src = voteLeftImage;
voteDiv.appendChild(leftImage);
var numberDiv = document.createElement('DIV');
numberDiv.style.backgroundImage = 'url(\'' + voteCenterImage + '\')';
numberDiv.innerHTML = '0%';
numberDiv.id = 'result_voteTxt' + currentOptionId;
voteDiv.appendChild(numberDiv);
var rightImage = document.createElement('IMG');
rightImage.src = voteRightImage;
voteDiv.appendChild(rightImage);
pollVotes[pollId][currentOptionId] = value;
totalVotes[pollId] = totalVotes[pollId]/1 + value/1;
}
}
}
}
var totalVoteP = document.createElement('P');
totalVoteP.className = 'result_totalVotes';
totalVoteP.innerHTML = txt_totalVotes + totalVotes[pollId];
voteDiv.appendChild(totalVoteP);
setPercentageVotes(pollId);
slideVotes(pollId,0);
}
function setPercentageVotes(pollId)
{
for(var prop in pollVotes[pollId]){
pollVotes[pollId][prop] = Math.round( (pollVotes[pollId][prop] / totalVotes[pollId]) * 100);
}
var currentSum = 0;
for(var prop in pollVotes[pollId]){
currentSum = currentSum + pollVotes[pollId][prop]/1;
}
pollVotes[pollId][prop] = pollVotes[pollId][prop] + (100-currentSum);
}
function slideVotes(pollId,currentPercent)
{
currentPercent = currentPercent/1 + 1;
for(var prop in pollVotes[pollId]){
if(pollVotes[pollId][prop]>=currentPercent){
var obj = document.getElementById('result_voteTxt' + prop);
obj.innerHTML = currentPercent + '%';
obj.style.width = Math.max(graphMinWidth,Math.round(currentPercent/100*graphMaxWidth)) + 'px';
}
}
if(currentPercent<100)setTimeout('slideVotes("' + pollId + '","' + currentPercent + '")',pollScrollSpeed);
}
function prepareForPollResults(pollId)
{
document.getElementById('poller_waitMessage' + pollId).style.display='block';
document.getElementById('poller_question' + pollId).style.display='none';
}
function castMyVote(pollId,formObj)
{
var elements = formObj.elements['vote[' + pollId + ']'];
var optionId = false;
for(var no=0;no<elements.length;no++){
if(elements[no].checked)optionId = elements[no].value;
}
Poller_Set_Cookie('dhtmlgoodies_poller_' + pollId,'1',6000000);
if(optionId){
var ajaxIndex = ajaxObjects.length;
ajaxObjects[ajaxIndex] = new sack();
ajaxObjects[ajaxIndex].requestFile = serverSideFile + '?pollId=' + pollId + '&optionId=' + optionId;
prepareForPollResults(pollId);
ajaxObjects[ajaxIndex].onCompletion = function(){ showVoteResults(pollId,ajaxIndex); }; // Specify function that will be executed after file has been found
ajaxObjects[ajaxIndex].runAJAX(); // Execute AJAX function
}
}
function displayResultsWithoutVoting(pollId)
{
var ajaxIndex = ajaxObjects.length;
ajaxObjects[ajaxIndex] = new sack();
ajaxObjects[ajaxIndex].requestFile = serverSideFile + '?pollId=' + pollId;
prepareForPollResults(pollId);
ajaxObjects[ajaxIndex].onCompletion = function(){ showVoteResults(pollId,ajaxIndex); }; // Specify function that will be executed after file has been found
ajaxObjects[ajaxIndex].runAJAX(); // Execute AJAX function
}

代码如下:

/* Simple AJAX Code-Kit (SACK) v1.6.1 */
/* 2005 Gregory Wild-Smith */
/* www.twilightuniverse.com */
/* Software licenced under a modified X11 licence,
see documentation or authors website for more details */
function sack(file) {
    this.xmlhttp = null;
    this.resetData = function() {
        this.method = "POST";
        this.queryStringSeparator = "?";
        this.argumentSeparator = "&";
        this.URLString = "";
        this.encodeURIString = true;
        this.execute = false;
        this.element = null;
        this.elementObj = null;
        this.requestFile = file;
        this.vars = new Object();
        this.responseStatus = new Array(2);
    };
    this.resetFunctions = function() {
        this.onLoading = function() { };
        this.onLoaded = function() { };
        this.onInteractive = function() { };
        this.onCompletion = function() { };
        this.onError = function() { };
        this.onFail = function() { };
    };
    this.reset = function() {
        this.resetFunctions();
        this.resetData();
    };
    this.createAJAX = function() {
        try {
            this.xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e1) {
            try {
                this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e2) {
                this.xmlhttp = null;
            }
        }
        if (! this.xmlhttp) {
            if (typeof XMLHttpRequest != "undefined") {
                this.xmlhttp = new XMLHttpRequest();
            } else {
                this.failed = true;
            }
        }
    };
    this.setVar = function(name, value){
        this.vars[name] = Array(value, false);
    };
    this.encVar = function(name, value, returnvars) {
        if (true == returnvars) {
            return Array(encodeURIComponent(name), encodeURIComponent(value));
        } else {
            this.vars[encodeURIComponent(name)] = Array(encodeURIComponent(value), true);
        }
    }
    this.processURLString = function(string, encode) {
        encoded = encodeURIComponent(this.argumentSeparator);
        regexp = new RegExp(this.argumentSeparator + "|" + encoded);
        varArray = string.split(regexp);
        for (i = 0; i < varArray.length; i++){
            urlVars = varArray[i].split("=");
            if (true == encode){
                this.encVar(urlVars[0], urlVars[1]);
            } else {
                this.setVar(urlVars[0], urlVars[1]);
            }
        }
    }
    this.createURLString = function(urlstring) {
        if (this.encodeURIString && this.URLString.length) {
            this.processURLString(this.URLString, true);
        }
        if (urlstring) {
            if (this.URLString.length) {
                this.URLString += this.argumentSeparator + urlstring;
            } else {
                this.URLString = urlstring;
            }
        }
        // prevents caching of URLString
        this.setVar("rndval", new Date().getTime());
        urlstringtemp = new Array();
        for (key in this.vars) {
            if (false == this.vars[key][1] && true == this.encodeURIString) {
                encoded = this.encVar(key, this.vars[key][0], true);
                delete this.vars[key];
                this.vars[encoded[0]] = Array(encoded[1], true);
                key = encoded[0];
            }
            urlstringtemp[urlstringtemp.length] = key + "=" + this.vars[key][0];
        }
        if (urlstring){
            this.URLString += this.argumentSeparator + urlstringtemp.join(this.argumentSeparator);
        } else {
            this.URLString += urlstringtemp.join(this.argumentSeparator);
        }
    }
    this.runResponse = function() {
        eval(this.response);
    }
    this.runAJAX = function(urlstring) {
        if (this.failed) {
            this.onFail();
        } else {
            this.createURLString(urlstring);
            if (this.element) {
                this.elementObj = document.getElementById(this.element);
            }
            if (this.xmlhttp) {
                var self = this;
                if (this.method == "GET") {
                    totalurlstring = this.requestFile + this.queryStringSeparator + this.URLString;
                    this.xmlhttp.open(this.method, totalurlstring, true);
                } else {
                    this.xmlhttp.open(this.method, this.requestFile, true);
                    try {
                        this.xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")
                    } catch (e) { }
                }
                this.xmlhttp.onreadystatechange = function() {
                    switch (self.xmlhttp.readyState) {
                        case 1:
                            self.onLoading();
                            break;
                        case 2:
                            self.onLoaded();
                            break;
                        case 3:
                            self.onInteractive();
                            break;
                        case 4:
                            self.response = self.xmlhttp.responseText;
                            self.responseXML = self.xmlhttp.responseXML;
                            self.responseStatus[0] = self.xmlhttp.status;
                            self.responseStatus[1] = self.xmlhttp.statusText;
                            if (self.execute) {
                                self.runResponse();
                            }
                            if (self.elementObj) {
                                elemNodeName = self.elementObj.nodeName;
                                elemNodeName.toLowerCase();
                                if (elemNodeName == "input"
                                || elemNodeName == "select"
                                || elemNodeName == "option"
                                || elemNodeName == "textarea") {
                                    self.elementObj.value = self.response;
                                } else {
                                    self.elementObj.innerHTML = self.response;
                                }
                            }
                            if (self.responseStatus[0] == "200") {
                                self.onCompletion();
                            } else {
                                self.onError();
                            }
                            self.URLString = "";
                            break;
                    }
                };
                this.xmlhttp.send(this.URLString);
            }
        }
    };
    this.reset();
    this.createAJAX();
}

(0)

相关推荐

  • ajax poller

    Ajax poller Copyright (C) 2006 DTHMLGoodies.com, Alf Magne Kalleland This library is free software; you can redistribute it and/or modify it under the terms of the GNU Lesser General Public License as published by the Free Software Foundation; either

  • 原生JavaScrpit中异步请求Ajax实现方法

    在前端页面开发的过程中,经常使用到Ajax请求,异步提交表单数据,或者异步刷新页面. 一般来说,使用Jquery中的$.ajax,$.post,$.getJSON,非常方便,但是有的时候,我们只因为需要ajax功能而引入Jquery比较不划算. 所以接下来便用原生JavaScrpit实现一个简单的Ajax请求,并说明ajax请求中的跨域访问问题,以及多个ajax请求的数据同步问题. JavaScript实现Ajax异步请求 简单的ajax请求实现 Ajax请求的原理是创建一个XMLHttpReq

  • thinkPHP5 ajax提交表单操作实例分析

    本文实例讲述了thinkPHP5 ajax提交表单操作.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script> <

  • FormData+Ajax实现上传进度监控

    什么是FormData? FormData对象可以组装一组用 XMLHttpRequest发送请求的键/值对.它可以更灵活方便的发送表单数据,因为可以独立于表单使用.如果你把表单的编码类型设置为multipart/form-data ,则通过FormData传输的数据格式和表单通过submit() 方法传输的数据格式相同: 如何创建一个FormData对象 你可以自己创建一个FormData对象,然后通过调用它的append()方法添加字段,就像这样: //实例化一个formData对象 var

  • ajax跳转到新的jsp页面的方法

    ajax可以实现局部刷新页面,即在不刷新整个页面的情况下更新页面的局部信息. 项目中遇到一个问题:在用户列表也,当点击某个按钮时需要去查询用户的信息,查询成功跳转到用户详情界面:查询失败,则在原页面弹出提示信息. 想到两个解决办法: 方法一: 点击按钮,调用普通方法去查询用户信息,查询成功跳转到用户详情页面:查询失败,重定向调用查询用户列表的方法,在查询用户列表的方法结束后重新跳转到用户列表页面并弹出提示信息,相当于重新加载了用户列表页面. 方法二: 根据需求,不可以重新加载用户列表页面.用aj

  • ajax实现输入提示效果

    本文实例为大家分享了ajax实现输入提示效果的具体代码,供大家参考,具体内容如下 网站主页 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin:0px auto; padding:0px; } .l{ height:50px; wid

  • 简单实现ajax三级联动效果

    本文实例为大家分享了ajax三级联动效果展示的具体代码,供大家参考,具体内容如下 主页面代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="../wenjian/jquery-2.2.3.min.js"></sc

  • 四步轻松实现ajax发送异步请求

    ajax发送异步请求,供大家参考,具体内容如下 第一步(得到XMLHttpRequest) ajax其实只需要学习一个对象:XMLHttpRequest,如果掌握了它,就掌握了ajax!!! 1.得到XMLHttpRequest 大多数浏览器都支持:var xmlHttp=new XMLHttpRequest(); IE6.0:var xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); IE5.0以更早版本的IE:var xmlHttp=new A

  • Ajax邮箱、用户名唯一性验证实例代码

    废话不多说了,直接给大家贴代码了,具体代码如下所示: <script type="text/javascript"> $(function () { $("#txtEmail").blur(function () { $.ajax({ type: "post", url: "reg.ashx?email=" + $.trim($("#txtEmail").val()) + "&

  • 解决Ajax加载JSon数据中文乱码问题

    一.问题描述 使用zTree的异步刷新父级菜单时,服务器返回中文乱码,但项目中使用了SpringMvc,已经对中文乱码处理,为什么还会出现呢? 此处为的异步请求的配置: Java代码 async: { enable: true, url: basePath + '/sysMenu/listSysMenu', autoParam: ["id=parentId"] } SpringMvc中文字符处理: Java代码 <mvc:annotation-driven> <mvc

随机推荐