如何使jQuery验证插件适用于IE中的下拉列表

Question

jQuery验证插件http://bassistance.de/jquery-plugins/jquery-plugin-validation/IE中的下拉列表有问题。我使用的是jQuery 1.7.2、验证插件1.9.0和jQuery UI 1.8.21。

请参阅：http://quickshare.spreadsheet-converter.com/l/p/4jp8gq42fv57/

• 在IE 7中，验证有效，即它阻止表单提交，但不应用"error"类。虽然在处于无效状态之后，我可以选择有效的值。(尽管我的IE 7不是我关心的。)

• 在IE 8中，验证工作正常，应用了"error"类，所以我看到了"红色"边框。但是，在处于无效状态后，我可以而不是打开下拉列表-它会自动折叠。不过，我可以双击以选择有效值。

• 在IE 9中，验证有效，应用了"error"类，但在处于无效状态后，我无法选择有效值。下拉列表通过单击和双击自动打开和关闭。我也不能通过使用左/右键来更改值——这通常可以通过下拉菜单来实现。

有什么提示吗？

谢谢！

更新：演示页面http://jquery.bassistance.de/validate/demo/radio-checkbox-select-demo.html适用于下拉列表，"error"类也应用于无效状态。它能与CSS相关吗？

更新2：我在一个简单的页面上测试了1.9和1.10版本的验证插件。我发现像这样初始化errorPlacement对象是导致问题的原因。即使我注释了errorPlacement的主体函数，问题也会消失。插件网站上的演示不是这样的。

$('#formc').validate({      
errorPlacement: function(error, element){               
//$(element).attr({'title': error.text()});
}

Answer 1

看起来IE不喜欢select上的title属性。在我的例子中，我在errorPlacement中使用引导工具提示。我的修复程序如下：

errorPlacement: function (error, element) {
$(element).tooltip({ title: $(error).text(), container: 'body' });
}

这只是完全忽略了设置title属性。你也可以确定元素是否是一个选择，并尝试一些类似的替代选项：

errorPlacement: function (error, element) {
if($(element).is('select'){
...do something else
}
else{
$(element).attr({'title': error.text()});
}
}