jquery 验证插件没有为我的 HTML 触发

jquery validate plugin is not firing for my HTML

单击“保存”按钮后,我需要对文本字段进行某些验证,例如 需要名称,最小长度,最大长度。

我正在为此目的使用 jquery validation.js 文件

这是我的 jsfiddle

http://jsfiddle.net/5RrGa/1284/

<form id="myform">
    <input type="text" id="name" placeholder="Name" class="icon-user" /> <a href="#" class="savedata">Save</a>
</form>



$(document).ready(function () {
    $('#myform').validate({
        rules: {
            name: {
                required: true
            }
        },
        messages: {
            name: {
                required: 'name required'
            }
        }
    });
});

$(document).on("click", ".savedata", function (e) {
    alert('do an ajax call here');
});

我需要进行所有验证,如果所有验证都通过,我需要调用 savedata 事件侦听器。

任何人都可以帮助我为什么没有调用验证方法吗??

这是我的完整 HTML 代码

<html>
   <head>
      <title>OrderMySnack</title>
      <script src="js/jquery-1.9.1.js"></script>
      <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
   </head>
   <body class="vendorBg">
      <form id="myform">
         <input type="text" id="name" placeholder="Name" class="icon-user">
         <a href="#" class="fillBtn">Save</a>
      </form>
<script>
$(function(){
$('#myform').validate({
    focusInvalid: false,
    rules: {
        name: {
            required: true
        }
    },
    messages: {
        name: {
            required: 'name required'
        }
    }
});
});

$(document).on("click", ".fillBtn", function(e) {
alert('do an ajax call here');
        });    
</script>
</body>
</html>

试试下面的代码。 添加了 name 属性到输入框和 valid() 方法到点击事件

<form id="myform">
 <input type="text" id="name" name="name" placeholder="Name" class="icon-user" /> 
<a href="#" class="savedata">Save</a> 
</form>
$(document).ready(function () {
$('#myform').validate({
    rules: {
        name: {
            required: true
        }
    },
    messages: {
        name: {
            required: 'name required'
        }
    }
});
});



$(document).on("click", ".savedata", function (e) { 
    $('#myform').valid();
  alert('do an ajax call here');
});