ajax poller

2016-02-19 11:02 10 1 收藏

岁数大了,QQ也不闪了,微信也不响了,电话也不来了,但是图老师依旧坚持为大家推荐最精彩的内容,下面为大家精心准备的ajax poller,希望大家看完后能赶快学习起来。

【 tulaoshi.com - Web开发 】

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;nooptions.length;no++){
var elements = options[no].split(//gi);
var currentOptionId = false;
for(var no2=0;no2elements.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(currentPercent100)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;noelements.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();
}

来源:http://www.tulaoshi.com/n/20160219/1596407.html

延伸阅读
标签: Web开发
AJAX - 更多有关 XMLHttpRequest 对象的知识 在向服务器发送数据之前,我们有必要解释一下 XMLHttpRequest 对象的三个重要的属性。 onreadystatechange 属性 onreadystatechange 属性存有处理服务器响应的函数。下面的代码定义一个空的函数,可同时对 onreadystatechange 属性进行设置: xmlHttp.onreadystatechange=function() { // 我...
标签: Web开发
由此Ajax攻击可见一斑,然而这还仅仅是个开始。7月份百度开通了百度空间,虽然没有指明是应用web2.0技术,但从web2.0象征的测试版(beta)和页面模版架构等等,你可以看出它事实上已经应用了Ajax技术。而在空间开通不到半个月,相应的攻击方式又产生了,这个攻击应该又算是一个蠕虫吧。它利用百度提交的自定义css(Cascading Stylesheet,层...
标签: Web开发
您的第一个AJAX应用程序 为了让您理解AJAX的工作原理,我们将创建一个小型的AJAX应用程序。 首先,我们需要一个带有两个文本框的HTML表单:用户名和时间。用户名文本框由用户填写,而时间文本框使用AJAX进行填写。 此HTML文件名为"testAjax.htm"(请注意这个HTML表单没有提交按钮!): html body...
 1<%@ Page language="c#" Codebehind="$FILENAME$.cs" AutoEventWireup="false" Inherits="$INHERITS$" %  2<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"    3  4<html  5  <head  6&nbs...
标签: Web开发
Ajax 由 HTML、JavaScript™ 技术、DHTML 和 DOM 组成,这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。本文的作者是一位 Ajax 专家,他演示了这些技术如何协同工作 —— 从总体概述到细节的讨论 —— 使高效的 Web 开发成为现实。他还揭开了 Ajax 核心概念的神秘面纱,包括 XMLHttpRequest 对象。 五年前,如果不知...

经验教程

321

收藏

26

精华推荐

AJAX了解AJAX优点缺点和运用

AJAX了解AJAX优点缺点和运用

乐观的农民一个

给初学ajax的人 ajax函数代码

给初学ajax的人 ajax函数代码

急需钱的来找我

AJAX教程(9):AJAX 请求 源代码

AJAX教程(9):AJAX 请求 源代码

词典66

微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部