如何在按下回车键时显示错误，如果文本区域为空？

Question

我正在开发一个聊天界面，目前一切运作良好，但是如果文本框为空，当我按下回车键时，我想显示一个错误提示。请问有什么方法可以实现吗？我已经尝试了许多方法，但都没有成功。谢谢。

$("#message").keypress(function(e) {
    var test = $("#Uname").val()
    var valmsg = $('#message').val();

    if (e.which == 13 && valmsg.trim()) {
        $("#chat").append("<div class='mesaj'>" + test+ ':' + valmsg + "  </div>");
        $('#message').val('');  
    }
});

这是我的代码 https://jsfiddle.net/azfwuzad/2/

- azazu testing

Answer 1

当按下回车键时，您可以通过检查文本区域的值是否为空来实现此操作。请尝试以下方法：

$("#message").keypress(function(e) {
    var test = $("#Uname").val()
    var valmsg = $('#message').val();

    if (e.which == 13 && valmsg.trim() == "") {
        e.preventDefault();
        alert('Please type a message to send');
    } else if (e.which == 13) {
        $("#chat").append("<div class='mesaj'>" + test + ':' + valmsg + "</div>");
        $('#message').val('');
    }
});

更新的例子

preventDefault() 的调用将阻止回车键在空文本区域中添加新行。

- Rory McCrossan

---

@Rory McCrossan，实际上可以通过单词“required”来完成相同的功能，但它不起作用 :-( 我错过了回答...你有什么快速想法为什么它不起作用吗？ - Prasad

@Rory McCrossan，嘿，在文本区域中我仍然会得到一个新行，但只有在发送文本之后。你可以告诉我如何解决吗？谢谢 :) - azazu testing

在这种情况下，您需要在两个if条件中都放置e.preventDefault()：https://jsfiddle.net/azfwuzad/15/ - Rory McCrossan