Jquery validate bug resolution under ie8

  • 2020-03-29 23:45:04
  • OfStack

The project used the form validation plug-in of jquery with validate. Before, I just did a very simple validation without doing any slightly complicated application. Recently, the project has raised the application requirements.
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201311/201311131600291.gif? 2013101316053 ">  
And then it's natural to use the plug-in's valid() function:
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201311/201311131601192.gif? 2013101316133 ">  
This can really reach the effect of phase to, but actually there is a problem, under the ie8 valid () method always returns false, and all the fields will be as required fields check, struggle for a long time, because the jquery plugin code is very complex, so look particularly difficult at first, then step by step, find the problem, the problem is in the attributeRules () function:
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201311/201311131602043.gif? 2013101316216 ">  
This function also applies when you write validation rules on a page instead of in a script. Technically, this is reasonable and the handling of required is reasonable, but for ie8, it's a bit of a problem. Ie8 will execute the following branches:
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201311/201311131602404.gif? 2013101316252 ">  
Therefore, all fields are checked as required fields. After testing, there are two final solutions:

The first is to find the following code in the rules() method and comment out the call to attributeRules (). This is possible because validations are rarely written to the page.
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201311/201311131603305.gif? 2013101316347 ">  
The second solution requires two things: first, you need to make some changes to the attributeRules () method, replacing the getAttribute() method with the attr() method. Notice that getAttribute() is a js method, and attr() is a jquery method, and they use different objects. In fact, after this change, the bug below ie8 has been solved, but this problem appears again under ie7, so you need to use the latest jquery, I used the version of jquery1.10.2 when testing.
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201311/201311131604256.gif? 2013101316438 ">  
Oh, and finally, don't forget to block the form's default events.

Related articles: