2010-09-15 109 views
2

這在Opera中工作,但顯然沒有別的。JQuery - 按屬性選擇?

HTML

<input type="checkbox" name="iphone" value="checked" checked="checked" /> 
<input type="checkbox" name="photocart" value="checked" checked="checked" /> 

JS

$("input[name=iphone]").attr('checked', 'checked'); 
$("input[name=photocart]").attr('checked', 'checked'); 
$("input[name=iphone]").attr('disabled', 'disabled'); 
$("input[name=photocart]").attr('disabled', 'disabled'); 

我也曾嘗試以下無濟於事。

$("input[name|=iphone]").attr('checked', 'checked'); 
$("input[name|=photocart]").attr('checked', 'checked'); 
$("input[name|=iphone]").attr('disabled', 'disabled'); 
$("input[name|=photocart]").attr('disabled', 'disabled'); 

$("[name=iphone]").attr('checked', 'checked'); 
$("[name=photocart]").attr('checked', 'checked'); 
$("[name=iphone]").attr('disabled', 'disabled'); 
$("[name=photocart]").attr('disabled', 'disabled'); 

$("[name|=iphone]").attr('checked', 'checked'); 
$("[name|=photocart]").attr('checked', 'checked'); 
$("[name|=iphone]").attr('disabled', 'disabled'); 
$("[name|=photocart]").attr('disabled', 'disabled'); 

對他們中的任何人都沒有喜樂。有關我如何能夠實現這一目標的任何想法?

編輯: - 史詩失敗的HTML SORRY複製!

+2

你發佈的標記有'name'「hosting」,但是你的選擇器都沒有在尋找這個,你可以發佈這個JS正在尋找的標記嗎? – 2010-09-15 11:51:09

回答

1

首先,您有兩個名爲「hosting」的元素,但您並未使用「input [name = hosting]」。

你的HTML:

<input type="checkbox" name="iphone" value="checked" checked="checked" /> 
<input type="checkbox" name="photocart" value="checked" checked="checked" /> 

JS(即應該工作):

$('input[name=iphone]').attr('checked', true); 
$('input[name=photocart]').attr('checked', true); 
$('input[name=iphone]').attr('disabled', true); 
$('input[name=photocart]').attr('disabled', true); 

請記住,如果您有名爲 「iPhone」 或「photocart多個元素「那jQuery也會改變它們的屬性。

使用truefalse代替屬性值的「已檢查」或「禁用」。請記住,您正在操縱DOM,因此它與<input type="checkbox" disabled="disabled" />不同。

+0

對不起,粘貼了錯誤的html:S。你能再看一遍嗎?這已被修復 – JasonS 2010-09-15 11:57:14

+0

此外,我沒有太多的控制HTML,所以我寧願如果這是一個純粹的jQuery解決方案。 – JasonS 2010-09-15 11:57:49

+0

在您的HTML編輯之後查看我的編輯。 – 2010-09-15 11:58:34

1
//for each one 
$("input[name=photocart] :checked").val(); 
$("input[name=iphone] :checked").val(); 

//general, used with an event 
result = $(this).is(":checked"); 

//general, used with a css class in common (add a class="checkable" to your target inputs) 
$(".checkable:checked").each(function() { 
    result += this.value; 
} 
+0

對不起,粘貼了錯誤的html:S。你能再看一遍嗎?這已被修復。 – JasonS 2010-09-15 11:56:14

1

attribute selector[name=val]比賽有一個屬性這就是價值是完全val所有元素。在相反,[name|=val]比賽有一個屬性這就是價值或者確切地說是「val」或「val」開頭的所有元素緊跟「-」。後者更傾向於與語言代碼一起使用(例如[lang|=en]匹配lang="en-US")。因此,請使用前一個選擇器進行完全匹配。

0

請注意,你也可以去基本和做這些是這樣的:

if ($("input[name=iphone]")[0].checked) // returns true or false depending on the value 
if $("input[name=photocart]")[0].checked) 
if ($("input[name=iphone]")[0].disabled) // returns boolean value 
if ($("input[name=photocart]")[0].disabled) 

$("input[name=iphone]")[0].checked = true;// sets the check to true (checked) 
$("input[name=photocart]")[0].attr('checked', true); 
$("input[name=iphone]")[0].disabled = false;// enables the input control 
$("input[name=photocart]")[0].attr('disabled', true); 

另一個很酷的技巧,將值設置爲它目前還不是這就像一個的toogle:

$("input[name=iphone]")[0].checked = !$("input[name=iphone]")[0].checked; 

編輯:例如對所有選中的複選框設置爲未選中:

$("input:checked")[0] = false;// single 
$('input:checked').each(function() { 
    this.checked = true; 
}); 

注意:如果你給他們一類被稱爲「mycheckb黃牛」更簡單:

var toggle_click = false; 
$(function() { 
    $('.mycheckbox').click(function() { 
    $('.mycheckbox').each().checked = !this.checked; 
    toggle_click = !toggle_click; 
    }); 
}); 

,如果它被選中,取消選中它:

$('.cptIcdCheckbox:checked').each(function() { 
      this.checked = !this.checked; 
}); 

我使用這種技術,如果我有一個複選框列表和一個‘頭’複選框取消選中它們全部或檢查它們全部取決於「組標題」複選框值,它是單擊和/或更改事件。

+0

'$(...)'返回一個數組...你不需要執行'$(...)[0] .checked'等等來獲得實際的DOM對象嗎? – 2010-09-15 18:49:20

+0

@Cory Larson--簡言之,是後兩個例子中的每個。簡單的只適用於你只有一套 - 編輯示例。 – 2010-09-15 21:24:10