Question

我正在尝试验证textarea，但未对其进行验证，因此在不检查textarea的情况下提交了表单。请帮助。我的HTML和Javascript代码如下：

function validateMessage(f){

    var mesg = document.getElementById("enq_message").value;
    if(mesg==="" || mesg===null || mesg.length<1){

        document.getElementById("enq_message").style.border = "1px solid #FB6D3F";
        document.getElementById('enqmessage').innerHTML="Enter your message";
        return false;

    } else if(mesg.length>0 && mesg.length<100) {

        document.getElementById("enq_message").style.border = "1px solid #FB6D3F";
        document.getElementById('enqmessage').innerHTML="Message length must be minimum 100 characters.";
        return false;

    } else {

        document.getElementById("enq_message").style.border = "";
        document.getElementById('enqmessage').innerHTML="";
        return true;

    }

}

谢谢。

Answer 1

您可以在文本区域下方添加一个div，以便在此处显示错误消息。

一旦函数返回true，则提交。

我希望以下代码能解决该问题。

注意，一旦用户再次在文本区域输入中写入或清除了某些内容，就可以清除错误div。这样看起来就干净了。

function validateMessage(f){

var mesg = document.getElementById("enq_message").value;
if(mesg==="" || mesg===null || mesg.length<1){

    document.getElementById("enq_message").style.border = "1px solid #FB6D3F";
    document.getElementById('enqmessage').innerHTML="Enter your message";
    return false;

} else if(mesg.length>0 && mesg.length<100) {

    document.getElementById("enq_message").style.border = "1px solid #FB6D3F";
    document.getElementById('enqmessage').innerHTML="Message length must be minimum 100 characters.";
    return false;

} else {

    document.getElementById("enq_message").style.border = "";
    document.getElementById('enqmessage').innerHTML="";
    // write the code for submit if its a ajax call 
    // call the function and pass the values 
    alert("textarea has value go for sumbit")
    return true;

}
}

<textarea id="enq_message"></textarea>
<div id="enqmessage"></div>
<button onclick="validateMessage()">Submit</button>

Textarea无法验证

1 个答案: