不用ajax实现点击文字即可编辑的方法

刚接触creatElement ,appendChild 等东东!呵呵!
写了这个东西,可能在高手看来,非常的稚嫩!不过完全自己写的!
还没有完善,请大侠指导!!
看代码
复制代码 代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <style>
  .test{border:1px solid #ccc;background-color:#eee;width:200px;height:60px;}
  </style>
  <script language="Javascript">
  <!--
  function isIE(){ //ie? 
    if (window.navigator.userAgent.indexOf("MSIE")>=1) return true; 
    else return false; 

if(!isIE()){ //firefox innerText define
    HTMLElement.prototype.__defineGetter__("innerText", 
        function(){ 
            return this.textContent; 
        } 
    ); 
    HTMLElement.prototype.__defineSetter__("innerText", 
        function(sText){ 
            this.textContent=sText; 
        } 
    ); 
}function $(e){
    return document.getElementById(e);
  }
 var arr=new Array();
 function check(e){
 var v=0;
    for(i=0;i<arr.length;i++)
    {if(arr[i]==e) v=1;
    else v=0;}
    if(v) return true;
    else return false;
 }
 function edit(e){
    var x=$(e);
    var str=x.innerText;
    if (check(e))
    {
        //alert("已经存在在数组里!");
        //alert(str);
        var b=$(e+"fa");
        str=$(e+"faz").value;
        b.removeChild($(e+"faz"));
        x.innerText=str;
    }else{
        //alert("没有存在在数组里!");
        a1=document.createElement("div");
        a1.id=e+"fa";
        a=document.createElement("INPUT");
        a.name=e;
        a.id=e+"faz";
        a.value=str;
        x.innerHTML="";
        x.appendChild(a1);
        a1.appendChild(a);
        if(arr.length==0) arr[0]=e;
        else arr[arr.length]=e;
        //alert(a.name);
    }
  }
  -->
  </script>
 </HEAD>
 <BODY>
 <div class="test" id="test" onclick="edit('test')">可编辑的内容</div>
 <div class="test" id="test1" onclick="edit('test1')">可编辑的内容</div>
 </BODY>
</HTML>

最后解决浏览器问题的代码

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

JavaScript技术不用ajax实现点击文字即可编辑的方法,转载需保留来源!

郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。