Jquery验证textarea验证

时间:2016-08-17 16:38:39

标签: javascript jquery html validation

我对jquery验证很新,所以希望我的问题有一个简单的答案!

我有一个带有textarea的表单,我想做一个简单的验证(必需)。验证适用于简单的文本字段,但它不适用于文本区域... 我得到了以下代码来初始化jq validate。

注意我的textarea将id和name属性设置为“post_content”。

            /**
             * 
             */
            this.account_validator = $("form#profile_form").validate({
                rules: {
                    post_content : "required",
                    errorPlacement: function(label, element) {
                        if (element.is("textarea")) {
                            label.insertAfter(element.next());
                        } else {
                            $(element).closest('div').append(label);
                        }
                }
                }
            });

如果我的“post_content”是==“”并且我添加以下警告弹出窗口,我会得到以下内容

alert(this.account_validator.form()); --> true
alert(this.account_validator.element("#post_content")); --> false
alert(this.account_validator.form()); --> true

据我所知,验证器对象上的.element方法应该添加该元素进行验证,因此对form()方法的第二次调用也应返回false ...

顺便说一句,如果我的“post_content”是!=“”并且我添加以下警告弹出窗口,我会得到以下内容

alert(this.account_validator.form()); --> true
alert(this.account_validator.element("#post_content")); --> true
alert(this.account_validator.form()); --> true      

谢谢,

基督教

1 个答案:

答案 0 :(得分:0)

试试这个,这个基本的例子告诉你如何检查textarea值是否为空并显示警告文本



<html>
<head></head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<body>

<textarea style="width:300px;height:300px;" id="mytext"></textarea>
<h3 style="color:red; display:none;" id="warning">text area is empty</h3>
<input type="button" value="checkvalidaion" id="valid">

</body>

<script type="text/javascript">
//write button click function
$("#valid").click(function(){ //in thei line select the button using it's id
   var textareaVal = $("#mytext").val(); //get the value/text of the text are when button click
   
   //check the value
   if (textareaVal == "") 
   	{
   		$("#warning").show(); // if textarea value is empty then show the warning text
   	}
   	else
   	{
   		$("#warning").hide(); // else textaer value is not empty then hide the warning text
   	}

});
 

</script>

</html>
&#13;
&#13;
&#13;