如何在鼠标所在处插入文字？

直接用下面的代码就可以了
<%@LANGUAGE="JAVASCRIPT" CODEPAGE="936"%>
<HTML>
<HEAD>
<SCRIPT>
function storeCaret(textEl)
{
   if(textEl.createTextRange)   
   textEl.caretPos = document.selection.createRange().duplicate();
}
function insertAtCaret(textEl,text)
{
   if(textEl.createTextRange && textEl.caretPos)
   {
      var caretPos = textEl.caretPos;
      caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == '' ? text + '' : text;
   }
   else
      textEl.value  = text;
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="aForm">
<TEXTAREA NAME="aTextArea" ROWS="5" COLS="80" WRAP="soft" ONSELECT="storeCaret(this);" ONCLICK="storeCaret(this);" ONKEYUP="storeCaret(this);">测试测试测试测试测试测试</TEXTAREA>
<BR>
<INPUT TYPE="text" NAME="aText" SIZE="80" VALUE="要插入的文字">
<BR>
<INPUT TYPE="button" VALUE="在光标处插入" ONCLICK="insertAtCaret(this.form.aTextArea,this.form.aText.value);">
</FORM>
</BODY>
</HTML>
直接拷贝存为网页测试便知 。 。

解决方案 »

  1.   

    To：
     xishanlang2001(西山狼2000) 看看楼主怎么说的？
    －－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－
    就是在点一下的地方用程序插入文字，不涉及焦点跟着走的问题。
    －－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－
    点一下，光标自然就到了鼠标的位置，然后在光标位置插入字符，
    不就等于在鼠标处插入字符吗？？笨笨啊。。狼 。。
      

  2.   

    点一下光标并不是到鼠标的位置，
    如果点击的位置在该行的字符串内，则是在鼠标所点的位置，
    如果是在该行的字符串外，则光标停在该行的末尾。
    解决的方法
    如下，
    在该文本框的点击事件中
    在点击的时候取下鼠标的x值到变量 mx 中（其x值在event对象中）。
    再取该输入框的位置的left值到变量tx中
    取输入框的字体的大小，到变量fz
    将三者转化成一样的计量单位。
    判断
    if (mx>tx)
    {
       增加  cell((mx-tx)/fz)个空格
    }
    在onblur中检查，如果没有输入的话，则
    将增加的空格去掉。
    大体的思路就是这样的。
    可是很郁闷，我取文本框的位置的时候，出来的值居然什么都没有，
    所以没办法给你贴上没通过的代码。
    你找找看看，能不能取到该文本框的位置的值，如果有，也请通知我一下。
    这么一点了。
      

  3.   

    修改了一下
    <HTML>
    <HEAD>
    <SCRIPT>
    function storeCaret(textEl)
    {
       if(textEl.createTextRange)   
       textEl.caretPos = document.selection.createRange().duplicate();
    }
    function insertAtCaret(textEl,text)
    {
       if(textEl.createTextRange && textEl.caretPos)
       {
          var caretPos = textEl.caretPos-1;
          caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == '' ? text + '' : text;
       }
       else
          textEl.value  = text;
    }
    </SCRIPT>
    </HEAD>
    <BODY>
    <FORM NAME="aForm">
    <TEXTAREA NAME="aTextArea" ROWS="5" COLS="80" WRAP="soft" ONSELECT="storeCaret(this);" ONCLICK="storeCaret(this);" ONKEYUP="storeCaret(this);" onmouseup="insertAtCaret(this.form.aTextArea,this.form.aText.value);">测试测试测试测试测试测试</TEXTAREA>
    <BR>
    <INPUT TYPE="text" NAME="aText" SIZE="80" VALUE="要插入的文字">
    <BR>
    <INPUT TYPE="button" VALUE="在光标处插入" ONCLICK="insertAtCaret(this.form.aTextArea,this.form.aText.value);">
    </FORM>
    </BODY>
    </HTML>
      

  4.   

    再修正一下<HTML>
    <HEAD>
    <SCRIPT>
    function storeCaret(textEl)
    {
       if(textEl.createTextRange)   
       textEl.caretPos = document.selection.createRange().duplicate();
    }
    function insertAtCaret(textEl,text)
    {
       if(textEl.createTextRange && textEl.caretPos)
       {
          var caretPos = textEl.caretPos;
          caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == '' ? text + '' : text;
       }
       else
          textEl.value  = text;
    }
    </SCRIPT>
    </HEAD>
    <BODY>
    <FORM NAME="aForm">
    <TEXTAREA NAME="aTextArea" ROWS="5" COLS="80" WRAP="soft" ONSELECT="storeCaret(this);"  ONKEYUP="storeCaret(this);" onmouseup="storeCaret(this);insertAtCaret(this.form.aTextArea,this.form.aText.value);">测试测试测试测试测试测试</TEXTAREA>
    <BR>
    <INPUT TYPE="text" NAME="aText" SIZE="80" VALUE="要插入的文字">
    <BR>
    <INPUT TYPE="button" VALUE="在光标处插入" ONCLICK="insertAtCaret(this.form.aTextArea,this.form.aText.value);">
    </FORM>
    </BODY>
    </HTML>