javascript是面向对象的脚本语言,如果不懂对象的使用,那对javascript的掌握也谈不上熟悉了,只能说是了解而已,所以最近这段时间,我猛攻了一下javascript对象,学习了
很多实例,对javascript对象多少有点了解了,哈哈,以免自己以后忘记,我写了个小实例,供以后参考。
这个例子涉及的知识主要是Jquery,DOM,Javascript对象和prototype,以及数组。大意就是页面装载完毕之后,初始化一个数组。后面每隔3秒,调用getStatus函数,该函数
挑选数组中inrunning为3的元素,调用jquery方法,获取状态,当获取状态之后,使用新的状态刷新数组中相应元素的isrunning值,直到isrunning不为3。
function getStatus() {
var deployids = new Array();
deployids.splice(0, deployids.length);
for (var i = 0; i < tinfo.length; i++) {
if (tinfo[i].isrunning === "3") {
var deployid = tinfo[i].deployid;
deployids.push(deployid);
}
}
if (deployids.length > 0) {
$.get("<%=path%>/testManage_getTestStatus", {Action:"get", deployids:deployids.toString(), async:false}, function(data) {
var status = data.split(" ");
for (var i = 0; i < deployids.length; i++) {
var index = tinfo.get_index(deployids[i]);
tinfo[index].isrunning = status[i];
refresh(status[i], tinfo[index].tdid, tinfo[index].testid);
}
});
}
}
function refresh(s, id, testid) {
var div10 = "<div class=\"action create disabled\" alt=\"部署\" title=\"部署\"><span class=\"icon\"> </span></div>";
var div11 = "<div class=\"action create\" alt=\"部署\" title=\"部署\"><span class=\"icon\"> </span></div>";
var div20 = "<div class=\"action start disabled\" alt=\"启动部署\" title=\"启动部署\"><span class=\"icon\"> </span></div>";
var div21 = "<div class=\"action start\" alt=\"启动部署\" title=\"启动部署\" onclick=\"teststart('"+ testid + "', '"+ id +"')\"><span class=\"icon\"> </span></div>";
var div30 = "<div class=\"action stop disabled\" alt=\"停止部署\" title=\"停止部署\"><span class=\"icon\"> </span></div>";
var div31 = "<div class=\"action stop\" alt=\"停止部署\" title=\"停止部署\" onclick=\"teststop('"+ testid + "', '"+ id +"')\"><span class=\"icon\"> </span></div>";
var div40 = "<div class=\"action destroy disabled\" alt=\"销毁部署\" title=\"销毁部署\"><span class=\"icon\"> </span></div>";
var div41 = "<div class=\"action destroy\" alt=\"销毁部署\" title=\"销毁部署\" onclick=\"testdestroy('"+ testid + "', '"+ id +"')\"><span class=\"icon\"> </span></div>";
var div50 = "<div class=\"action manage disabled\" alt=\"删除测试\" title=\"删除测试\"><span class=\"icon\"> </span></div>";
var div51 = "<div class=\"action manage\" alt=\"删除测试\" title=\"删除测试\" onclick=\"testdel('"+ testid + "', '"+ id +"')\"><span class=\"icon\"> </span></div>";
var div60 = "<div class=\"action viewConsole disabled\" alt=\"检测资源\" title=\"检测资源\"><span class=\"icon\"> </span></div>";
var div61 = "<div class=\"action viewConsole\" alt=\"检测资源\" title=\"检测资源\" onclick=\"testresource('"+ testid + "', '"+ id +"')\"><span class=\"icon\"> </span></div>";
if ("3" == s) {
document.getElementById(id).innerHTML =
"<div width='100%' align='center'><image src='<%=request.getContextPath()%>/img/loading4.gif'></image></div>";
} else if ("1" == s) {
document.getElementById(id).innerHTML = div10 + div20 + div31 + div41 + div51 + div60;
} else if ("2" == s) {
document.getElementById(id).innerHTML = div10 + div21 + div30 + div41 + div51 + div60;
} else if ("0" == s) {
document.getElementById(id).innerHTML = div10 + div20 + div30 + div41 + div51 + div60;
}
}
function testInfo(index, testid, deployid, isrunning, tdid) {
this.testid = testid;
this.deployid = deployid;
this.isrunning = isrunning;
this.tdid = tdid;
this.index = index;
}
function get_index(deployid) {
var i;
for (i = 0; i < this.length; ++i) {
if (this[i].deployid === deployid) {
return this[i].index;
}
}
if (i == this.length) {
return -1;
}
}
function initTestInfo() {
var c = "${curtestcount}";
var testinfo = new Array();
for (var i = 0; i < c; ++i) {
var testindex = "test" + i;
var statusindex = "status"+i;
var deployindex = "deploy"+i;
var tdid = "td" + i;
var deployid = document.getElementById(deployindex).value;
var testid = document.getElementById(testindex).value;
var status = document.getElementById(statusindex).value;
var tmp = new testInfo(i, testid, deployid, status, tdid);
testinfo.push(tmp);
}
return testinfo;
}
var tinfo = null;
$(document).ready(function(){
Array.prototype.get_index = get_index;
tinfo = initTestInfo();
window.setInterval(getStatus, 3000);
});