Javascript：在html textarea和nicedit之间切换的问题

我正在使用nicedit（http://nicedit.com/index.php）。Javascript：在html textarea和nicedit之间切换的问题

我一直在试图创建一个默认的html textarea，当你点击它时变成一个nicedit文本字段。我希望它在失去焦点时恢复为纯HTML文本区域。当使用一个textarea时，我已经能够成功地完成这项工作，但是，当我使用两个textareas奇怪的事情发生时（在Firefox中）。我使用下面的脚本：

<script type="text/javascript" src="http://js.nicedit.com/nicEdit-latest.js"></script> <script type="text/javascript"> 

function fieldname_1() 
{ 
    area = new nicEditor({fullPanel : true}).panelInstance('fieldname'); 
    area.addEvent('blur', function() 
    { 
     area.removeInstance('fieldname'); 
     area = null; 
     document.getElementById("fieldname").onclick=function(){fieldname_2()} 
    }); 
} 

function fieldname_2() 
{ 
    area = new nicEditor({fullPanel : true}).panelInstance('fieldname'); 
    area.addEvent('blur', function() 
    { 
     area.removeInstance('fieldname'); 
     area = null; 
     document.getElementById("fieldname").onclick=function(){fieldname_1()} 
    }); 
} 

function fieldname2_1() 
{ 
    area = new nicEditor({fullPanel : true}).panelInstance('fieldname2'); 
    area.addEvent('blur', function() 
    { 
     area.removeInstance('fieldname2'); 
     area = null; 
     document.getElementById("fieldname2").onclick=function(){fieldname2_2()} 
    }); 
} 

function fieldname2_2() 
{ 
    area = new nicEditor({fullPanel : true}).panelInstance('fieldname2'); 
    area.addEvent('blur', function() 
    { 
     area.removeInstance('fieldname2'); 
     area = null; 
     document.getElementById("fieldname2").onclick=function(){fieldname2_1()} 
    }); 
} 

</script> 

<TEXTAREA id="fieldname" cols="35" onclick="fieldname_1();" ></TEXTAREA> 
<br><br><br> 
<TEXTAREA id="fieldname2" cols="35" onclick="fieldname2_1();" >Test text</TEXTAREA>

您单击并从作品完美无焦点，但是，您单击第二个文本区域不会试图以无焦点的时候dissappear第一textarea的。我究竟做错了什么？

来源

2011-01-31 KnowsLittle

请不要再问这个。 – Will 2011-02-01 14:16:09

你不能用多一个textarea来做这个诀窍，大约1000？

<!DOCTYPE html> 

<html> 
    <head> 
     <meta charset = "utf-8"> 

     <title></title> 

     <script src = "http://js.nicedit.com/nicEdit-latest.js"></script> 

     <script> 
      window.onload = function() { 
       var body = document.body; 
       var limit = 1000; 

       for (var i = 0; i < limit; i ++) { 
        var textarea = document.createElement ("textarea"); 
         textarea.style.height = "100px"; 
         textarea.style.width = "100%"; 

        body.appendChild (textarea); 
       } 

       // The magic 
       body.addEventListener ("click", function (event) { 
        var target = event.target; 

        if (target.nodeName === "TEXTAREA") { 
         var area = new nicEditor ({fullPanel : true}).panelInstance (target); 

         area.addEvent ("blur", function() { 
          this.removeInstance (target); 
         }); 
        } 
       }, false); 
      } 
     </script> 

     <style> 
      textarea { 
       height: 100px; 
       margin-bottom: 20px; 
       width: 1000px; 
      } 
     </style> 
    </head> 

    <body> 
     <!-- Create any textarea you want --> 
    </body> 
</html>

enter image description here

来源

2011-01-31 21:42:13 Caio

+1为解决方案的动画gif。好样的！ – 2012-04-23 16:52:56

这你想要做什么：

<script type="text/javascript" src="http://js.nicedit.com/nicEdit-latest.js"></script> 

<script type="text/javascript"> 

/* 
* Replace the textarea with the given id with an instance of niceEdit. 
* Attach an 'onblur' event to the editor that removes the niceEditor when 
* the editor loses focus, and add the onclick function to the restored textarea 
*/ 
function toggleEditor(id){ 
    new nicEditor({ fullPanel: true }).panelInstance(id).addEvent('blur', function() { 
     this.removeInstance(id); 
     document.getElementById(id).onclick=function(){ 
      toggleEditor(id) 
     }; 
    }); 
}; 

</script> 

<textarea id="fieldname" cols="35" onclick="toggleEditor(this.id);">Text text</textarea> 
<br><br><br> 
<textarea id="fieldname2" cols="35" onclick="toggleEditor(this.id);" >Test text</textarea>

来源

2011-01-31 21:53:51

Javascript：在html textarea和nicedit之间切换的问题

回答

相关问题