jQuery Validate Framework + qTip不会在提交时触发

时间:2011-07-09 21:35:41

标签: jquery internet-explorer-9 jquery-validate qtip2

在下文中,我正在尝试将jQuery Validate FrameworkqTip 2.0一起使用。

这适用于Chrome,但在IE9中没有任何想法?

<html>
<head>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" 
     type="text/javascript"></script>
  <script src="jquery.qtip.min.js" type="text/javascript"></script>
  <link rel="stylesheet" type="text/css" href="jquery.qtip.min.css"/>
  <script type="text/javascript" 
     src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {

var myForm = $('form:first');

   myForm.validate({
         errorClass: "errormessage",
         onkeyup: false,
         errorClass: 'error',
         validClass: 'valid',
         rules: {
            fullname: { required: true, minlength: 3 },
            email: { required: true, email: true }
         },
         errorPlacement: function(error, element)
         {
            // Set positioning based on the elements position in the form
            var elem = $(element),
               corners = ['left center', 'right center'],
               flipIt = elem.parents('span.right').length > 0;

            // Check we have a valid error message
            if(!error.is(':empty')) {
               // Apply the tooltip only if it isn't valid
               elem.filter(':not(.valid)').qtip({
                  overwrite: false,
                  content: error,
                  position: {
                     my: corners[ flipIt ? 0 : 1 ],
                     at: corners[ flipIt ? 1 : 0 ],
                     viewport: $(window)
                  },
                  show: {
                     event: false,
                     ready: true
                  },
                  hide: false,
                  style: {
                     classes: 'ui-tooltip-red ui-tooltip-rounded' // Make it red... the classic error colour!
                  }
               })

               // If we have a tooltip on this element already, just update its content
               .qtip('option', 'content.text', error);
            }

            // If the error is empty, remove the qTip
            else { elem.qtip('destroy'); }
         },
         success: $.noop, // Odd workaround for errorPlacement not firing!
   });
});

</script>
<form id="MyForm" autocomplete="off" method="post">
   <input id="Field1" name="fullname" 
          type="text" 
          value="" maxlength="20" />
   <br/>
   <input id="Field2" name="email" 
          type="text" 
          value="" maxlength="255" />
   <br/>
   <input type="submit" value="Submit order" />
</form>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

数组/对象中的最后一个元素以尾随逗号结尾,IE不会喜欢这个,但其他浏览器都可以使用它。

 success: $.noop    // removed comma