VAL（）時，沒有值屬性設置

考慮下面的HTML返回的HTML（），而不是不確定的VAL（）時，沒有值屬性設置

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

正如你所看到的，其中的一個選項有一個屬性的值設置與其他沒有。但是，當我通過jQuery去檢查每個選項的val()時，沒有設置值屬性的選項會返回標記（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與解決方案。

來源

2012-09-19 sbeliv01

如果您不想要選項有一個值，您需要使用''，即使如此，它實際上也有一個空字符串（'「」'），它在概念上與沒有值（'null'）有所不同。 – zzzzBov

這是正確的，標準的行爲。如果沒有value屬性，則元素的文本內容將用作元素的值。

從W3C website：

如果沒有[value屬性]，選項元素的值是該元素的的textContent。

您可以測試DOM節點上使用getAttribute內容屬性的存在：

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

或者，你可以使用jQuery的is方法與「具有屬性」選擇：

$option.is('[value]') // returns false

來源

2012-09-19 16:50:27 lonesomeday

瞭解，但這並沒有真正回答這個問題。有沒有一種方法可以檢查value屬性，該屬性根據屬性是否實際設置或是否設置爲某個選項返回true或false？ – sbeliv01

@ sbeliv01請參閱編輯。 – lonesomeday

如果你只是想要一個布爾值，你也可以使用[hasAttribute]（https://developer.mozilla.org/en-US/docs/DOM/element.hasAttribute）。 –

VAL（）時，沒有值屬性設置

回答

相關問題