javascript - jQuery(formElement).val(null) : inconsistent results in different browsers

Question

代码在这里:

http://jsfiddle.net/jf7t2/1/

请在所有浏览器的最新版本上运行它，并亲自查看。单击按钮时，将显示:

1. 在 Chrome(当然还有 Safari)上，它只是不选择任何内容，而是创建一些幽灵般的空选项
2. 在 Firefox 和 Opera 上，它按照我期望的方式工作，取消选择所有选项
3. 在 Internet Explorer 上，它不执行任何操作

那么，哪一种是预期行为？

Answer 1

如果您查看 jQuery 1.5.1 源代码第 1970 行，您会看到以下内容:

// Treat null/undefined as ""; convert numbers to string
if ( val == null ) {
    val = "";

因此，预期的行为与您将空字符串作为参数提供相同。

如果继续查看第 1984 行，您将看到以下内容:

} else if ( jQuery.nodeName( this, "select" ) ) {
  var values = jQuery.makeArray(val);

  jQuery( "option", this ).each(function() {
    this.selected = jQuery.inArray( jQuery(this).val(), values ) >= 0;
  });
  if ( !values.length ) {
   this.selectedIndex = -1;
  }

所以预期的行为是:

1. 如果有一个带有空字符串值的选项，请选择该选项。
2. 如果未设置selectedIndex = -1

从这里开始，如果 selectedIndex 设置为 -1，则由浏览器决定要做什么

查看msdn library它说:

The selectedIndex property returns -1 if a select object does not contain any selected items. Setting the selectedIndex property clears any existing selected items.

因此，在 ie 中，预期的行为似乎是它将取​​消选择所有选项

MDC documentation 也是如此。因此，Firefox 对此非常明确

Returns the index of the currently selected item. You may select an item by assigning its index to this property. By assigning -1 to this property, all items will be deselected.

基于 webkit 的浏览器似乎对事物有不同的看法。

如果你用谷歌搜索“webkit selectedIndex”，你会看到很多关于 select 标签的错误报告，所以也许它只是很时髦;)

想想看，这是 jQuery 中的一个错误，因为它是一个应该能够在浏览器之间表现相同的库 - 应该报告它;)