有无办法控制TEXTAREA中的"\t"宽度

7707 2010-09-06 08:58:30

textarea中的\t的宽度有无办法控制?

如一个textarea中文本内容为a\tb,显示出来间隔超级宽: a b.

...全文

289 6 打赏收藏转发到动态举报

写回复

用AI写文章

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

7707 2010-09-06

打赏
举报

用空格是不行的.因为是做HTML编辑器,这个制表符仅是对源码进行排版的需要.不能干预用户输入的内容.
想要的效果如下:



<body>

    <div>

        <span></span>

    </div>

</body>

看来只能放弃了.google了一大堆tabsize,没找到有用的解决方案.

sohighthesky 2010-09-06

打赏
举报

这个没必要控制，\t是控制字符，在不同编辑器中显示宽度不一样是正常的，这才出现了很多编辑使用空格代替制表符的做法，
或者你也可以考虑用空格

7707 2010-09-06

打赏
举报

我是在做一个HTML编辑器,想在HTML源界面对代码进行缩进.

超级宽啊,占8个英文字符的位置呢,能让它占4字符位置就好了

chokobo 2010-09-06

打赏
举报

我的浏览器里没有显示超级宽。
感觉不能控制，参考各文本编辑器中类似功能，一个tab显示多宽应该是和浏览器或系统的默认设置有关，html自身没法改

7707 2010-09-06

打赏
举报

2楼给的这个链接和我问的无关,并且还是错误的....

我想要控制这个\t的显示宽度,不是要插入一个\t,至于如何插入\t,随手写了几行代码,IE和FF下测试通过,其它主流浏览器应该没问题,如下:



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script type="text/javascript">

        function editTab(e) {

            var tag = e.srcElement || e.target;

            if (e.keyCode == 9) {

                if (typeof (tag.selectionStart) != 'undefined') {

                    var start = tag.selectionStart;

                    var scrollpos = tag.scrollTop;

                    tag.value = tag.value.substr(0, tag.selectionStart) + '\t' + tag.value.substr(tag.selectionEnd);

                    tag.selectionStart = start + 1;

                    tag.selectionEnd = start + 1;

                    tag.scrollTop = scrollpos;

                } else if (document.selection && document.selection.createRange) {

                    var rng = document.selection.createRange();

                    rng.text = '\t';

                    rng.select();

                } else {

                    tag.value += text;

                }

                tag.focus();

                document.all ? e.returnValue = false : e.preventDefault();

            }

        }

    </script>

</head>

<body>

    <textarea id="aaa" cols="80" rows="20" name="input" onkeydown="editTab(event)"></textarea>

</body>

</html>