【问题标题】:Enter key in textarea在文本区域输入键
【发布时间】:2011-01-07 03:57:59
【问题描述】:

我有一个textarea,在textarea 中按下的每个Enter 键上,我希望新行以一个项目符号开头,比如(*)。怎么办?

请不要使用 jQuery。

我可以观察 Enter 键,然后!?我是否必须获取 textarea 的全部值并将 * 附加到它并再次填充 textarea

【问题讨论】:

  • 按照下面的提示,我找到了解决方案。

标签: javascript textarea


【解决方案1】:

你可以这样做:

<body>

<textarea id="txtArea" onkeypress="onTestChange();"></textarea>

<script>
function onTestChange() {
    var key = window.event.keyCode;

    // If the user has pressed enter
    if (key === 13) {
        document.getElementById("txtArea").value = document.getElementById("txtArea").value + "\n*";
        return false;
    }
    else {
        return true;
    }
}
</script>

</body>

虽然按回车的换行符仍然存在,但它是获得你想要的东西的开始。

【讨论】:

  • 这仅适用于 IE:window.event 在其他浏览器中不支持。
  • Doug Crockford 让我告诉你使用 === 而不是 ==。
  • 如果你写 onkeypress="return onTestChange();"那么原始的换行符将被忽略。
  • 如果您按 Enter 并且该行之后已经存在一行或多行,则不是很有用。它将最终删除新行之后的所有行。
  • 要在现代浏览器中使用,请将onkeypress="onTestChange();" 替换为onkeypress="onTestChange(event);",将function onTestChange() { 替换为function onTestChange(e) {,并将var key = window.event.keyCode; 替换为var key = e.keyCode
【解决方案2】:

只需将此 tad 添加到您的文本区域。

onkeydown="if(event.keyCode == 13) return false;"

【讨论】:

  • 也许你可以扩展这个答案。它似乎不起作用。
【解决方案3】:

您需要考虑用户在文本中间按下回车的情况,而不仅仅是在结尾处。我建议按照建议在keyup 事件中检测回车键,并使用正则表达式确保该值符合您的要求:

<textarea id="t" rows="4" cols="80"></textarea>
<script type="text/javascript">
    function formatTextArea(textArea) {
        textArea.value = textArea.value.replace(/(^|\r\n|\n)([^*]|$)/g, "$1*$2");
    }

    window.onload = function() {
        var textArea = document.getElementById("t");
        textArea.onkeyup = function(evt) {
            evt = evt || window.event;

            if (evt.keyCode == 13) {
                formatTextArea(this);
            }
        };
    };
</script>

【讨论】:

  • evt = evt || window.event; :这条线是干什么用的?
  • @Fifi:这是旧版本的 Internet Explorer(我认为是 8 及以下)没有将事件作为参数传递给事件处理程序,而是使用全局 window.event。现在不需要了。
【解决方案4】:

我的场景是当用户在输入 textarea 时按下回车键我必须包含一个换行符。我使用下面的代码实现了这一点......希望它可以帮助某人......

function CheckLength()
{
    var keyCode = event.keyCode
    if (keyCode == 13)
    {
        document.getElementById('ctl00_ContentPlaceHolder1_id_txt_Suggestions').value = document.getElementById('ctl00_ContentPlaceHolder1_id_txt_Suggestions').value + "\n<br>";
    }
}

【讨论】:

    【解决方案5】:

    你可以这样做:

    $("#txtArea").on("keypress",function(e) {
        var key = e.keyCode;
    
        // If the user has pressed enter
        if (key == 13) {
            document.getElementById("txtArea").value =document.getElementById("txtArea").value + "\n";
            return false;
        }
        else {
            return true;
        }
    });
    &lt;textarea id="txtArea"&gt;&lt;/textarea&gt;

    【讨论】:

    • 他说没有 jQuery
    猜你喜欢
    • 1970-01-01
    • 2016-09-01
    • 1970-01-01
    • 1970-01-01
    • 2011-09-04
    • 2015-06-08
    • 2020-04-23
    • 1970-01-01
    • 2015-01-22
    相关资源
    最近更新 更多