3

次の HTML を検討してください。

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

ご覧のとおり、オプションの 1 つには value 属性が設定されており、もう 1 つには設定されていません。ただし、val()jQuery を介して各オプションを確認すると、値属性が設定されていないオプションは、通常期待する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 Web サイトから:

[a value 属性] がない場合、option 要素の値は要素の textContent になります。

getAttributeDOM ノードで使用して、 content 属性の存在をテストできます。

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

isまたは、 「has-attribute」セレクターでjQuery メソッドを使用できます。

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