javascript - jquery添加验证功能

Question

我有一个这样的 JS 代码验证：

if (theForm.chk_ccd.checked            &&
           (! theForm.ccd_pos [0].checked) &&
           (! theForm.ccd_pos [1].checked) &&
           (! theForm.ccd_pos [2].checked))
        {
          window.alert ('Please select data from the \"CCD Position\" field.');
          theForm.ccd_pos [0].focus ();
          return;
        }

现在我想将该函数添加到我的 Jquery JS 函数中：

function ActionAdd (theForm)
    {
        $().ready(function()
        {
            $("#form").validate(
            {
                rules:
                {
                    de_no: "required",
                    de_name: "required",
                    product_name: "required",
                    plabel_no: "required",
                },
                messages:
                {
                    de_no: "<div class='error'>Please provide Part No.</div>",
                    de_name: "<div class='error'>Please provide Model Name</div>",
                    product_name: "<div class='error'>Please provide Product Name</div>",
                    plabel_no: "<div class='error'>Please provide Part No. (Pack Label)</div>",
                }
            });
        });
    }

有人有建议吗？

Answer 1

我认为您需要简单的 jquery 验证演示来了解它是如何工作的。所以在这里我添加了
jsfiddle 链接。

HTML

<form id="myForm">
  <input type="text" name="userName">
  <input type="text" name="userPass">
</form>
<input  value="Submit" type="button" id="submitForm">

JS
http://jsfiddle.net/prWUn/

Answer 2

function ActionAdd (theForm)
    {
            $("#form").validate(
            {
                rules:
                {
                    de_no: "required",
                    de_name: "required",
                    product_name: "required",
                    plabel_no: "required",
                },
                messages:
                {
                    de_no: "<div class='error'>Please provide Part No.</div>",
                    de_name: "<div class='error'>Please provide Model Name</div>",
                    product_name: "<div class='error'>Please provide Product Name</div>",
                    plabel_no: "<div class='error'>Please provide Part No. (Pack Label)</div>",
                }
            });
if (theForm.chk_ccd.checked            &&
           (! theForm.ccd_pos [0].checked) &&
           (! theForm.ccd_pos [1].checked) &&
           (! theForm.ccd_pos [2].checked))
        {
          window.alert ('Please select data from the \"CCD Position\" field.');
          theForm.ccd_pos [0].focus ();
          return;
        }
    }