喜悦国际村 - 代码共享 - tdedit的代码，用的时候只要改下Table名字，在htm里（/body前）调用一下就OK(页 1)

喜悦国际村 » 代码共享 » tdedit的代码，用的时候只要改下Table名字，在htm里（/body前）调用一下就OK

页: [1]

ys5955092

2008-3-10 03:15 AM

tdedit的代码，用的时候只要改下Table名字，在htm里（/body前）调用一下就OK

tdedit.js
//编辑html表格中的字段td
var tdx = -1;
var isedit = false;
var canleft=true,canright=true,candown=true,canup=true;
var obj = document.getElementById("tb2");
var thettd = 0;
function restore(){
for(var i = 4;i<obj.cells.length;i++){
      obj.cells[i].style.backgroundColor="";
      obj.cells[i].style.color="";
}
if(tdx>=(obj.cells.length-1)){
      tdx = obj.cells.length-1;
      canright=false;
      candown=false;
}
else if(tdx<=0){
      tdx = 0;
      canleft=false;
      canup=false;

}
else{
      //canleft=true;
   // canright=true;
      candown=true;
      canup=true;
}
}
/*function right(){
tdx++;
restore();
obj.cells[tdx].style.backgroundColor="gray";
obj.cells[tdx].style.color="#FFFFFF";
}
function left(){
tdx--;
restore();
obj.cells[tdx].style.backgroundColor="gray";
obj.cells[tdx].style.color="#FFFFFF";
}*/
/*function down(){
tdx = tdx + obj.rows[0].cells.length;
restore();
obj.cells[tdx].style.backgroundColor="gray";
obj.cells[tdx].style.color="#FFFFFF";
}
function up(){
tdx = tdx - obj.rows[0].cells.length;
restore();
obj.cells[tdx].style.backgroundColor="gray";
obj.cells[tdx].style.color="#FFFFFF";
}*/
document.onkeydown = function(){
//if(event.keyCode==37 && canleft && !isedit) left();
//if(event.keyCode==38 && canup && !isedit) up();
//if(event.keyCode==39 && canright && !isedit) right();
// if(event.keyCode==40 && candown && !isedit) down();
if(event.keyCode==13 && isedit){
      losefocus();
}
}
obj.onmousedown = function(){
if(event.srcElement.tagName=="TD" && event.srcElement.currentStyle.backgroundColor!="gray"){
      var therows = event.srcElement.parentElement.rowIndex;
      var thecells = event.srcElement.cellIndex;
      var a_rows_cells = event.srcElement.parentElement.cells.length;
      tdx = therows*a_rows_cells+thecells;
   //if((tdx >= 4) && (parseInt((tdx-4)%3)== 0))
   if((tdx >= (a_rows_cells-1)) &&( parseInt(tdx%a_rows_cells)!= 0)&&(parseInt(tdx%a_rows_cells)!=(a_rows_cells-1)))
   {//只让子网字段可以编辑
      restore();
      event.srcElement.style.backgroundColor = "gray";
      event.srcElement.style.color = "#FFFFFF";
   }
}
else{
      if((event.srcElement.style.backgroundColor == "gray") && (isedit==false)){
         var myinput = document.createElement("input");
         myinput.id = "myinputx";
         myinput.style.width = "70%";
         myinput.value = event.srcElement.innerHTML;
         event.srcElement.innerHTML = "";
         event.srcElement.appendChild(myinput);
         isedit = true;
         window.setTimeout(setfocus(),200);
      }
}
}
function setfocus(){
if (isedit){
      var myinputxrng = document.getElementById("myinputx").createTextRange();
      myinputxrng.collapse(false);
      myinputxrng.select();
      thettd = document.getElementById("myinputx").parentElement;
      document.getElementById("myinputx").onblur = losefocus;
}
}
function losefocus(){
thettd.innerHTML = document.getElementById("myinputx").value;
isedit = false;
}
//-->

记得代码放在
</table>
<script  src="../../js/tdedit.js" language="javascript"></script>
</body>
</html>
刚找到的。呵呵

查看完整版本: tdedit的代码，用的时候只要改下Table名字，在htm里（/body前）调用一下就OK