Jquery验证器文本框不等于默认值

时间:2012-07-12 01:02:42

标签: jquery

我正在尝试验证我的表单,因为用户在按钮点击时输入信息,而不是提交。我正在尝试制作能够检测文本框中文本是否为默认值的内容。但是,它不起作用。

我对jquery验证器并不熟悉。这是我到目前为止所拥有的。

$(document).on("click", "#numexercisesbutton, #submitworkout",
                    function() { //adds exercises 
                        jQuery.validator.addMethod("notEqual", function(value,
                                element, param) {
                            return this.optional(element) || value !== param;
                        }, "Please choose a value!");

                        $("#addworkout").validate({

                            rules: {
                                weightinputboxes: {
                                    required: true,
                                    notEqual: "Enter Weight"
                                }
                            },
                            messages: {
                                weightinputboxes: {
                                    notEqual: "please enter a value"
                                } 

                            }

                            }

                        )




                        if ($("#addworkout").valid()) {

                            addexercises.call(this);
                        }
                    });

不确定为什么它不起作用。我试图模仿这篇文章:jQuery Validate: Not default value

编辑HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>

<script type="text/javascript" src="/static/jquery-1.7.2.min.js"> </script>
<script type="text/javascript" src="/static/jquery-ui-1.8.21.custom.min.js"> </script>
<link rel="stylesheet" href="/static/jquery-ui-1.8.21.custom.css"  type="text/css">
<script type="text/javascript" src="/static/jquery.validate.js"> </script>
<script type="text/javascript" src="/static/jquery.validate.min.js"> </script>

<link rel="stylesheet" href="/static/addworkout.css"  type="text/css">
<script type="text/javascript" src="/static/addworkout.js"></script>




</head>
{% extends "masterpage.html" %}
{% block content %}
<body>
<form action="/submitworkout/" method="get" id="addworkout">
<div id="workoutentrycontainer">
<div id="exercisesthisworkout">
<p>Workout Date: </p>
<input type="text" class="required" id="workoutdate" name="workoutdate"> 
<p>Body Weight:</p>
<input type="text" class="textbox" id="weight" name="weight"> 
<p>How many unique exercises</p>
<input type="text" class="textbox required" id="numexercises" name="numexercises"> 
<input type="button" class="button"  value="Add" id="numexercisesbutton"> 
<input type="text" value="Enter Weight" name="weightinputboxes" class="required"> 

</div>
</div>


</form>
</body>
{% endblock %}
</html>

1 个答案:

答案 0 :(得分:0)

$("#..").validate({..})

焦点工作移出框。你正在结合点击和模糊。

在您的代码中,流程如下:

  1. 点击按钮将激活验证方法。
  2. 点击按钮后,当您输入文本框并将焦点移出框时,验证器将验证该值。