Javascript 表单验证onkeyup

我使用此代码在用户点击enter键时发送值。我想要的是，如果用户在没有输入任何值的情况下点击enter，他会得到一个错误

<textarea class="auto-grow-input" onfocus="SK_focusChat();" onkeyup="SK_sendChatMessage(this.value,<?php echo $sk['chat']['recipient']['id']; ?>,event);"></textarea>

---

我想你可以像下面这样编写你的
SK_sendChatMessage
函数

function SK_sendChatMessage(text,recipient_id,e) {
document.title = document_title;
textarea_wrapper = $('.chat-textarea');
chat_messages_wrapper = $('.chat-messages');

if (e.keyCode == 13 && e.shiftKey == 0 && text == '') {
    alert('enter text');
}
else{
  textarea_wrapper.find('textarea').val('');
    chat_messages_wrapper.append('<div class="chat-text align-right temp-text" align="right"><div class="text-wrapper float-right">' + text + '<div class="marker-out"><div class="marker-in"></div></div></div><div class="float-clear"></div></div>');

    $.post(SK_source() + '?t=chat&a=send_message', {text: text, recipient_id: recipient_id}, function (data) {
        chat_messages_wrapper
            .append(data.html)
            .scrollTop(chat_messages_wrapper.prop('scrollHeight'))
            .find('.temp-text')
                .remove();
    });
}

函数SK_sendChatMessage（文本，收件人id，e）{
document.title=文件\标题；
textarea_wrapper=$（'.chat textarea'）；
chat_messages_wrapper=$（'.chat messages'）；
如果（e.keyCode==13&&e.shiftKey==0&&text==“”）{
警报（“输入文本”）；
}
否则{
textarea_wrapper.find（'textarea'）.val（''）；
聊天信息包装器。附加（“”+文本+“”）；
$.post（SK_source（）+'？t=chat&a=send_message'，{text:text，recipient_id:recipient_id}，函数（数据）{
聊天信息包装器
.append（data.html）
.scrollTop（聊天信息包装器.prop（'scrollHeight'））
.find（“.temp text”）
.remove（）；
});
}
两个问题：首先，在SK_sendChatMessage函数的最顶端添加以下内容

if ($('textarea.auto-grow-input').text().length === 0) {
    alert('Must enter text');
    return false;
}    

其次，使用this.value不会向事件侦听器回调发送任何数据。因为您使用的是textarea而不是输入，它没有要引用的属性值。这意味着所有使用textarea值验证字符长度的尝试都将失败

你的代码也有其他的机会，最好不要让JavaScript（或者CSS）与你的HTML内联

您可以附加keyup事件和非常长的聊天时间，如下所示：

$('textarea.auto-grow-input').keyup(function(e) {
    if ($(this).text().length === 0) {
        alert('Must Enter Text');
        return false;
    }

  if (e.keyCode == 13 && e.shiftKey == 0) {
      textarea_wrapper.find('textarea').val('');
      chat_messages_wrapper.append('<div class="chat-text align-right temp-text" align="right"><div class="text-wrapper float-right">' + $(this).text() + '<div class="marker-out"><div class="marker-in"></div></div></div><div class="float-clear"></div></div>');

  $.post(SK_source() + '?t=chat&a=send_message', {text: text, recipient_id: recipient_id}, function (data) {
    chat_messages_wrapper
        .append(data.html)
        .scrollTop(chat_messages_wrapper.prop('scrollHeight'))
        .find('.temp-text')
            .remove();
   });
});

$（'textarea.auto grow input'）.keyup（函数（e）{
if（$（this）.text（）.length==0）{
警报（“必须输入文本”）；
返回false；
}
如果（e.keyCode==13&&e.shiftKey==0）{
textarea_wrapper.find（'textarea'）.val（''）；
chat_messages_wrapper.append（“”+$（this.text（）+“”）；
$.post（SK_source（）+'？t=chat&a=send_message'，{text:text，recipient_id:recipient_id}，函数（数据）{
聊天信息包装器
.append（data.html）
.scrollTop（聊天信息包装器.prop（'scrollHeight'））
.find（“.temp text”）
.remove（）；
});
});
认真地说，使用jQuery验证来检查是否有空。他们在验证方面做得非常好

<style>
.error { color: red; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>

<script>
$(document).ready(function() {
    // validate signup form on keyup and submit
    $("#omfg").validate({
        rules: {
            omfgdood: "required"
        },
        messages: {
            omfgdood: "Oy! It\'s Empty!" 
        }
    });
});
</script>

<?php $sk['chat']['recipient']['id'] = 'omfgdood'; ?>
<form id="omfg">
    <textarea class="auto-grow-input" id="<?php echo $sk['chat']['recipient']['id']; ?>" name="<?php echo $sk['chat']['recipient']['id']; ?>"></textarea>
    <input type="submit" name="submit" value="Submit" />
</form>


.错误{颜色：红色；}
$（文档）.ready（函数（）{
//在键盘上验证注册表格并提交
$（“#omfg”）.validate({
规则：{
omfgdood：“必需”
},
信息：{
天哪！它是空的
}
});
});
试试jQuery的表单验证库。它对这种功能的效果非常好。你能发布SK_sendChatMessage函数的代码吗？我已经完成了，但无法得到想要的结果。我只想阻止用户发送空白消息。@BrianBolli我已经添加了SK_sendChatMessage函数。请帮助我解决这个问题“我浏览了jqueryvalidation.org/documentation，但没有得到想要的结果。“~真的吗？！阻止空白消息是一个主要功能。只需应用
必需的
规则，消息就不能空白发送。我已添加了当前功能。请告诉我要编辑什么和添加什么。谢谢。我已更新了你的功能，但你可以更改警报消息。
<style>
.error { color: red; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>

<script>
$(document).ready(function() {
    // validate signup form on keyup and submit
    $("#omfg").validate({
        rules: {
            omfgdood: "required"
        },
        messages: {
            omfgdood: "Oy! It\'s Empty!" 
        }
    });
});
</script>

<?php $sk['chat']['recipient']['id'] = 'omfgdood'; ?>
<form id="omfg">
    <textarea class="auto-grow-input" id="<?php echo $sk['chat']['recipient']['id']; ?>" name="<?php echo $sk['chat']['recipient']['id']; ?>"></textarea>
    <input type="submit" name="submit" value="Submit" />
</form>