用JS控制在文本域里显示表情图

就像QQ里一样的单击表情图标，就会显示表情DIV，然后在单击其中的一个表情，就会显示在文本域里
<BODY>
  <SCRIPT LANGUAGE="JavaScript">
       function showFace() {var faceDiv = document.createElement("div");
faceDiv.className = 'facebox';
faceDiv.style.position = 'absolute';
var faceul = document.createElement("ul");
for(i=1; i<17; i++) {
var faceli = document.createElement("li");
faceli.innerHTML = '<img src="image/face/'+i+'.gif"  onclick="inner()"/>';
faceul.appendChild(faceli);
}
faceDiv.appendChild(faceul);
document.body.appendChild(faceDiv)
//定位菜单}
function inner(){
document.getElementById("ids").appendChild(faceli);}
    </SCRIPT>
 <textarea width="900"  id="ids"></textarea>
    <br>
    <input type="button" value=" add " onClick="showFace()" />
  
</BODY>
请高手给我指教 下我这个单击ADD按钮，会出来一个表情图的层，但是我单击其中的一个表情图，不会出来在文本域里

解决方案 »

  1.   

    document.getElementById("ids").appendChild(faceli);中的faceli是局部变量，在inner函数中没有值，你需要把faceli作为全局变量，这样showFace执行后，在inner()才有值
      

  2.   

    因为你是在showFace函数内定义的var faceli,所以是局部变量。
      

  3.   

    var去掉的话相当于你没有定义变量faceli，而系统给你默认在全局补上了变量faceli的定义。
      

  4.   

    试着研究研究csdn这个回复框的实现，呵呵
      

  5.   

    <BODY>
    <SCRIPT LANGUAGE="JavaScript">
    function showFace() {
    var faceDiv = document.createElement("div");
    faceDiv.className = 'facebox';
    faceDiv.style.position = 'absolute';
    var faceul = document.createElement("ul");
    for(i=1; i<17; i++) {
    var faceli = document.createElement("li");
    faceli.innerHTML = '<img id="' + i + '" src="image/face/'+i+'.gif" onclick="inner("' + i + '")"/>';
    faceul.appendChild(faceli);
    }
    faceDiv.appendChild(faceul);
    document.body.appendChild(faceDiv)
    //定位菜单
    }function inner(num){
    var currentFace = document.getElementById(num);
    document.getElementById("ids").appendChild(currentFace);
    }
    </SCRIPT>
    <textarea width="900" id="ids"></textarea>
    <br>
    <input type="button" value=" add " onClick="showFace()" />
    </BODY>
      

  6.   

    点击ADD没有反应，没有显示在文本域里