DIV事件穿透


<html>
<script type="text/jscript">
function fun(){
var edit = document.getElementById("edit");
var view = document.getElementById("view");
var str = edit.value;
str = str.replace(/\n/g,"<br>");
view.innerHTML=str;
}
</script>
<body>
<div id="" style="position:absolute;left:20px;top:15px;text-align:right;width:50px; background-color:#003399; color:#FFFFFF;  float:left;"></div>
<textarea onKeyDown="fun()" style=" font-size:15px; font-family:Courier New;position:absolute;left:71px; top:20;height:expression(this.scrollHeight+40);width:80%;overflow:hidden; color:#111111; z-index:99;" wrap="off" id="edit">// JavaScript Document</textarea>
<div style=" font-size:15px; font-family:Courier New; position:relative; width:98%; left:64px; top:8px; z-index:100; cursor:text; color:#FF0000" id="view"></div>
</body>
</html>我这个是用来完成一个代码高亮显示的编辑器
在Textarea中编辑在上面的DIV中显示 现在的问题是 文本框无法获得焦点 鼠标不能在上面点
不要用滤镜那样会很卡！！
 谢谢配合 不要发一些无聊的回帖  发什么 百度一下 什么谷歌一下的！！

解决方案 »

  1.   

    用滤镜也不行的吧，你那个又不是空白的地方，上面有文字，始终会触发div的onclick事件的不过可以在div的onclick事件中使用document.getElementById("edit").focus(),使textare框获得焦点，但是无法精确定位了
    要精确定位的话，可以获取鼠标onclick事件时在DIV中的坐标，然后控制textare里面的光标位置
      

  2.   

    有个很稀烂的方法
    就是让上面的那个DIV 标签换一个 HTML 没有的 叫LABEL 的这样可以解决点空白位置 穿透过上面的标签
    看来真的是无法实现了
      

  3.   

    为什么不直接用div来替换文本域?
    div本身就是可以进行编辑的.
      

  4.   

    因为复制到DIV编辑器中内容 标签格式很乱 只适合HTML 不适合文本
    很难解析正确的文本格式
      

  5.   

    用滤镜 是 反过来的 DIV放在 TEXTAREA下面 吧TEXTAREA 透明 就可以看见DIV 所以
    完全可以达到效果 这样很卡