如何在HTML编辑框中允许选项卡?

时间:2009-12-17 16:54:04

标签: c# asp.net html

我知道这可能是一个非常初学的问题,我似乎无法找到答案,但无论如何。

如何允许多行HTML编辑框允许将标签放入其中?(而不是标签转到下一个控件)

我更愿意在没有javascript的情况下这样做。

4 个答案:

答案 0 :(得分:2)

没有JavaScript,你不能这样做。如果你想走那条路,这是一个sample done with jQuery

答案 1 :(得分:0)

请参阅here

<html>
<head>
<script type="text/javascript">
function setSelectionRange(input, selectionStart, selectionEnd) {
  if (input.setSelectionRange) {
    input.focus();
    input.setSelectionRange(selectionStart, selectionEnd);
  }
  else if (input.createTextRange) {
    var range = input.createTextRange();
    range.collapse(true);
    range.moveEnd('character', selectionEnd);
    range.moveStart('character', selectionStart);
    range.select();
  }
}

function replaceSelection (input, replaceString) {
    if (input.setSelectionRange) {
        var selectionStart = input.selectionStart;
        var selectionEnd = input.selectionEnd;
        input.value = input.value.substring(0, selectionStart)+ replaceString + input.value.substring(selectionEnd);

        if (selectionStart != selectionEnd){ 
            setSelectionRange(input, selectionStart, selectionStart +   replaceString.length);
        }else{
            setSelectionRange(input, selectionStart + replaceString.length, selectionStart + replaceString.length);
        }

    }else if (document.selection) {
        var range = document.selection.createRange();

        if (range.parentElement() == input) {
            var isCollapsed = range.text == '';
            range.text = replaceString;

             if (!isCollapsed)  {
                range.moveStart('character', -replaceString.length);
                range.select();
            }
        }
    }
}


// We are going to catch the TAB key so that we can use it, Hooray!
function catchTab(item,e){
    if(navigator.userAgent.match("Gecko")){
        c=e.which;
    }else{
        c=e.keyCode;
    }
    if(c==9){
        replaceSelection(item,String.fromCharCode(9));
        setTimeout("document.getElementById('"+item.id+"').focus();",0);    
        return false;
    }

}
</script>
</head>
<body>
<form>
<textarea name="data" id="data" rows="20" columns="35" wrap="off" onkeydown="return catchTab(this,event)" ></textarea>
<input type="submit" name="submit" value="Submit"/>
</form>

答案 2 :(得分:0)

狂野的预感,但我认为你想要在页面上有多个HTML编辑框,然后使用javascript(如jQuery)将它们放入单独的标签中。

标签需要某种javascript才能创建互动。

(唉。无视。我在想可视化用户界面标签。不是标签字符。)

答案 3 :(得分:-1)

<input id="textbox" />

<script language="JavaScript">
<!--


    var textbox = document.getElementById("textbox");
    if (textbox.addEventListener)
        textbox.addEventListener("keydown", this.textbox_keyHandler, false);
    else if (textbox.attachEvent)
        textbox.attachEvent("onkeydown", this.textbox_keyHandler);
    function textbox_keyHandler(e)
    {
        if (e.keyCode == 9)
        {
            var textbox = document.getElementById("textbox");
            textbox.value += "\t";
            if(e.preventDefault) e.preventDefault();
            return false;
        }
    }

// -->
</script>