3

考虑以下 HTML：

<select>
    <option value="hasAttr">Has a value attr</option>
    <option>Does not have a value attr</option>
</select>

如您所见，其中一个选项设置了 value 属性，而另一个则没有。但是，当我val()通过 jQuery 检查每个选项时，没有设置 value 属性的选项返回标签 ( html()) 内的文本，而不是undefined我通常期望的那样。

var $select = $('select');

$select.each(function() {
    var $this = $(this),
        $options = $this.children('option');

    $options.each(function(){
        var $option = $(this),
            $value  = $option.val(),
            $html   = $option.html();

        console.log('Option Value: '+ $value +'\nOption HTML: '+ $html);

    });

});

即使我更改代码来查找$option.attr('value')，我仍然得到相同的结果。有没有一种方法可以检查是否存在将返回布尔值<option>的属性？value

这是一个jsFiddle。

用解决方案更新了 jsFiddle。

4

1 回答 1

10

这是正确的、标准的行为。在没有value属性的情况下，元素的文本内容被用作元素的值。

来自W3C 网站：

如果没有 [a value 属性]，则 option 元素的值是该元素的 textContent。

getAttribute您可以在 DOM 节点上使用测试内容属性的存在：

$option[0].getAtribute('value') // returns null

is或者，您可以使用带有“has-attribute”选择器的 jQuery方法：

$option.is('[value]') // returns false
于 2012-09-19T16:50:27.577 回答