function addOnLoad(newFunction) {
     var oldFun = window.onload;
     if(typeof window.onload != "function") {
      window.onload = newFunction;
     }else {
      window.onload = function() {
       oldFun();
       newFunction();
      }
     }
    }
    function trOnclick(obj) {
     var keleKey = document.getElementById("keleKey");
     var url = ary[obj.i].url;
     location.href = url;
    }
    function prepareKeleTable() {
     var keleTr = document.getElementById("keleTable").getElementsByTagName("tr");
     var trCount = keleTr.length
     for(var i=0;i<trCount;++i) {
     keleTr[i].onmouseout = function() {this.style.backgroundColor = "#EEEEEE";};
     keleTr[i].onmouseover = function() {this.style.backgroundColor = "#CCCCCC";};
     keleTr[i].onclick = function(){ trOnclick(this); }
     }
    }
    /**
    * 
    * @param {Object} table
    * @info ÉèÖÃtableÑùʽ
    */
    function keleSelectStyle(obj,table) {
     table.style.border = "#CCCCCC solid 1px";
     table.style.backgroundColor = "#EEEEEE";
     table.style.color="#496397";
     table.style.borderCollapse="collapse";
     table.style.fontFamily = "arial,sans-serif";
     table.style.fontSize = "14px";
     table.style.lineHeight="20px";
     table.style.position = "absolute";
     table.style.top = obj["offsetHeight"]+ calculateOffsetTop(obj) + "px";
     if (tableAlign == "left") {
      table.style.left = calculateOffsetLeft(obj) + "px";
     } else {
      table.style.right = document.body.offsetWidth - calculateOffsetLeft(obj) -obj.offsetWidth + "px";
     }
    }
     function keleSelectOnclick(obj){
                                     clearTable();
     var table = document.createElement("table");
     table.setAttribute("id","keleTable");
     keleSelectStyle(obj,table);
     var tbody = document.createElement("tbody");
     for(var i=0;i<ary.length;++i) {
      var tr = document.createElement("tr");
      tr.i = i;
      var td1 = document.createElement("td");
      var td2 = createTd(ary[i].title);
      var img = createImg(ary[i].img);
      td1.style.padding = "1px";
      td1.width = "18px";
      td1.appendChild(img);
      td2.style.padding = "1px";
      tr.appendChild(td1);
      tr.appendChild(td2);
      tr.style.cursor = "pointer";
      tbody.appendChild(tr);
     }
     table.appendChild(tbody);
     document.body.appendChild(table);
     prepareKeleTable();
    
     /*
     if(document.getElementById("keleTable")) {
      alert("yes");
      alert(document.getElementById("keleTable").innerHTML);
     } else {
      alert("no");
     }
     */
    }
    function prepareKeleSelect() {
    var keleSelect = document.getElementById("keleSelect");
    keleSelect.onblur = function() { setTimeout("clearTable()",100);}
    keleSelect.onclick = function() { keleSelectOnclick(this); return false;};
    
    }
    function calculateOffsetLeft(field) {
     return calculateOffset(field,"offsetLeft");
    }
    function calculateOffsetTop(field) {
     return calculateOffset(field,"offsetTop");
    }
    function calculateOffset(field,attr) {
     if(field) {
      return field[attr] + calculateOffset(field.offsetParent, attr);
     } else {
      return 0;
     }
    }
    function clearTable() {
     if(!document.getElementById("keleTable")) return false;
     var keleTable = document.getElementById("keleTable");
     document.body.removeChild(keleTable);
    }
    function createTd(text){
     var td = document.createElement("td");
     var textNode = document.createTextNode(text);
     td.appendChild(textNode);
    
     return td;
    }
    function createImg(url) {
     if (url != "") {
      var img = document.createElement("img");
      img.setAttribute("src", url);
      return img;
     } else {
      var text = document.createTextNode(" ");
      return text;
     }
    }
addOnLoad(prepareKeleSelect);