Am'd place să fac așa ceva să bifați o casetă de selectare pentru utilizarea jQuery:
$(".myCheckBox").checked(true);
sau
$(".myCheckBox").selected(true);
Face un astfel de lucru exista?
Folosi .prop()
:
$('.myCheckbox').prop('checked', true);
$('.myCheckbox').prop('checked', false);
Daca're de lucru cu un singur element, puteți întotdeauna doar acces subiacente HTMLInputElement
și modifice .verificat
proprietăți:
$('.myCheckbox')[0].checked = true;
$('.myCheckbox')[0].checked = false;
Beneficiul de a utiliza .prop () "și".attr()
metode în loc de acest lucru este faptul că acestea vor funcționa pe toate potrivite elemente.
A .prop()
metodă nu este disponibilă, astfel încât aveți nevoie pentru a utiliza .attr()
.
$('.myCheckbox').attr('checked', true);
$('.myCheckbox').attr('checked', false);
Rețineți că acest lucru este modul de abordare folosit de jQuery's unitate de teste înainte de versiunea 1.6 și este de preferat să utilizați $('.myCheckbox').removeAttr('verificat');
deoarece acesta din urmă va fi, în cazul în care caseta a fost verificat inițial, de a schimba comportamentul unui apel pentru a .reset()
în orice formă, care conține – un mod subtil, dar probabil nedorit de schimbare a comportamentului.
Pentru mai mult context, unele incomplete discuție de modificările aduse de manipulare a "verificat" de atribute/proprietăți în trecerea de la 1.5.x la 1.6 pot fi găsite în versiunea 1.6 de presă note și Atribute vs Proprietăți secțiunea a .prop()
documentația.
Acesta este modul corect de a verifica și debifați casetele de selectare cu jQuery, ca este cross-platform, standard, și va permite forma reposts.
$('.myCheckBox').each(function(){ this.checked = true; });
$('.myCheckBox').each(function(){ this.checked = false; });
De a face acest lucru, utilizați JavaScript standarde pentru verificarea și debifând casetele de selectare, astfel încât orice browser-ul, care pune în aplicare în mod corespunzător "verificat" proprietate de selectare element va rula acest cod impecabil. Acest lucru trebuie să fie ** toate browserele majore, dar sunt în imposibilitatea de a testa precedent a Internet Explorer 9.
Problema (jQuery 1.6):
Odată ce un utilizator face clic pe o casetă de selectare, care caseta nu mai răspunde la "verificat" atribut modificări.
Aici este un exemplu de selectare atribut nu reușesc să facă treaba după ce cineva a clic caseta (acest lucru se întâmplă în Chrome).
[Vioara][1]
Soluție:
Prin utilizarea JavaScript's "verificat" proprietate pe DOM elemente, suntem în măsură să rezolve problema în mod direct, în loc de încercarea de a manipula DOM in a face ceea ce am vrea ** să facă.
[Vioară][3]
Acest plugin va modifica verificate de proprietate de orice elemente, selectate de către jQuery, și cu succes, verificați și debifați casetele de selectare în toate circumstanțele. Deci, în timp ce acest lucru poate părea ca o soluție de rulmenți, se va face site-ul dvs.'s experiență de utilizare mai bună, și de a ajuta pentru a preveni utilizator de frustrare.
(function( $ ) {
$.fn.checked = function(value) {
if(value === true || value === false) {
// Set the value of the checkbox
$(this).each(function(){ this.checked = value; });
}
else if(value === undefined || value === 'toggle') {
// Toggle the checkbox
$(this).each(function(){ this.checked = !this.checked; });
}
return this;
};
})( jQuery );
Alternativ, dacă nu doriți să utilizați un plugin, puteți utiliza următoarele fragmente de cod:
// Check
$(':checkbox').prop('checked', true);
// Un-check
$(':checkbox').prop('checked', false);
// Toggle
$(':checkbox').prop('checked', function (i, value) {
return !value;
});
Poti face
$('.myCheckbox').attr('checked',true) //Standards compliant
sau
$("form #mycheckbox").attr('checked', true)
Dacă aveți un cod personalizat în onclick eveniment pentru selectare pe care doriți pentru a trage, utilizați acest lucru în schimb:
$("#mycheckbox").click();
Aveți posibilitatea să debifați prin eliminarea atributului în întregime:
$('.myCheckbox').removeAttr('checked')
Puteți verifica toate căsuțele astfel:
$(".myCheckbox").each(function(){
$("#mycheckbox").click()
});
De asemenea, puteți extinde $.fn obiect cu noi metode:
(function($) {
$.fn.extend({
check : function() {
return this.filter(":radio, :checkbox").attr("checked", true);
},
uncheck : function() {
return this.filter(":radio, :checkbox").removeAttr("checked");
}
});
}(jQuery));
Apoi, puteți face:
$(":checkbox").check();
$(":checkbox").uncheck();
Sau poate vrei să le mai dau nume unice ca mycheck() și myuncheck() în cazul în care utilizați alte biblioteci care utilizează aceste nume.
$("#mycheckbox")[0].checked = true;
$("#mycheckbox").attr('checked', true);
$("#mycheckbox").click();
Ultima va trage faceți clic pe eveniment pentru selectare, alții nu vor. Deci, dacă aveți un cod personalizat în onclick eveniment pentru selectare pe care doriți pentru a trage, utilizați ultima.
Să bifați o casetă de selectare ar trebui să utilizați
$('.myCheckbox').attr('checked',true);
sau
$('.myCheckbox').attr('checked','checked');
și să debifați o casetă de selectare ar trebui să întotdeauna setat la false:
$('.myCheckbox').attr('checked',false);
Dacă faci
$('.myCheckbox').removeAttr('checked')
se elimină atributul toate împreună și, prin urmare, nu va fi capabil pentru a reseta forma.
[REA DEMO jQuery 1.6][1]. Cred că acest lucru este rupt. Pentru 1.6 am de gând să facă un nou post pe asta.
[NEW DEMO de LUCRU jQuery 1.5.2][2] funcționează în Chrome.
Ambele demo-uri folosesc
$('#tc').click(function() {
if ( $('#myCheckbox').attr('checked')) {
$('#myCheckbox').attr('checked', false);
} else {
$('#myCheckbox').attr('checked', 'checked');
}
});
Acest selectează elementele care trebuie specificate atribut cu o valoare care conține date subșir "ckbItem":
$('input[name *= ckbItem]').prop('checked', true);
Se va selecta toate elementele care conțin ckbItem în numele său atribut.
Presupunând că întrebarea este...
Amintiți-vă că într-un tipic de selectare stabilite, toate de intrare categorie au același nume, ele diferă prin atributul "valoare": nu există IDENTITATE pentru fiecare intrare din set.
Xian's răspunsul poate fi extins cu un mai specifice selector, folosind următoarea linie de cod:
$("input.myclass[name='myname'][value='the_value']").prop("checked", true);
Să bifați o casetă de selectare folosind jQuery 1.6 sau mai mare doar a face acest lucru:
checkbox.prop('checked', true);
Să debifați, utilizați:
checkbox.prop('checked', false);
Aici' s ce-mi place să utilizați o casetă de selectare pentru a comuta folosind jQuery:
checkbox.prop('checked', !checkbox.prop('checked'));
Daca're folosind jQuery 1.5 sau mai mici:
checkbox.attr('checked', true);
Să debifați, utilizați:
checkbox.attr('checked', false);
Aici este o modalitate de a face fără jQuery
function addOrAttachListener(el, type, listener, useCapture) {
if (el.addEventListener) {
el.addEventListener(type, listener, useCapture);
} else if (el.attachEvent) {
el.attachEvent("on" + type, listener);
}
};
addOrAttachListener(window, "load", function() {
var cbElem = document.getElementById("cb");
var rcbElem = document.getElementById("rcb");
addOrAttachListener(cbElem, "click", function() {
rcbElem.checked = cbElem.checked;
}, false);
}, false);
<label>Click Me!
<input id="cb" type="checkbox" />
</label>
<label>Reflection:
<input id="rcb" type="checkbox" />
</label>
Aici este codul pentru a bifat si debifat cu un buton:
var set=1;
var unset=0;
jQuery( function() {
$( '.checkAll' ).live('click', function() {
$( '.cb-element' ).each(function () {
if(set==1){ $( '.cb-element' ).attr('checked', true) unset=0; }
if(set==0){ $( '.cb-element' ).attr('checked', false); unset=1; }
});
set=unset;
});
});
Update: Aici este același bloc de cod, folosind cele mai noi Jquery 1.6+ prop metodă, care înlocuiește attr:
var set=1;
var unset=0;
jQuery( function() {
$( '.checkAll' ).live('click', function() {
$( '.cb-element' ).each(function () {
if(set==1){ $( '.cb-element' ).prop('checked', true) unset=0; }
if(set==0){ $( '.cb-element' ).prop('checked', false); unset=1; }
});
set=unset;
});
});
Putem folosi `elementObject cu jQuery pentru obtinerea atributul verificat:
$(objectElement).attr('checked');
Putem folosi acest lucru pentru toate versiuni jQuery, fără nici o eroare.
Update: Jquery 1.6+ a noua prop metodă care înlocuiește attr, de exemplu:
$(objectElement).prop('checked');
Dacă utilizați PhoneGap faci cerere de dezvoltare, și tu ai o valoare pe butonul pe care doriți să arate instantaneu, amintiți-vă pentru a face acest lucru
$('span.ui-[controlname]',$('[id]')).text("the value");
Am constatat că, fără span, interfața nu se va actualiza indiferent de ceea ce faci.
Aici este codul si demo pentru modul de a verifica mai multe casete de selectare...
$("#check").on("click", function () {
var chk = document.getElementById('check').checked;
var arr = document.getElementsByTagName("input");
if (chk) {
for (var i in arr) {
if (arr[i].name == 'check') arr[i].checked = true;
}
} else {
for (var i in arr) {
if (arr[i].name == 'check') arr[i].checked = false;
}
}
});
Să fie conștienți de pierderi de memorie în Internet Explorer înainte de Internet Explorer 9, ca jQuery documentația membre:
În Internet Explorer înainte de versiunea 9, cu ajutorul .prop() pentru a seta un DOM element de proprietate pentru nimic altceva decât un simplu primitiv valoare (număr, șir de caractere, sau boolean) poate provoca pierderi de memorie în cazul în care proprietatea este nu eliminate (cu ajutorul .removeProp()) înaintea DOM element este eliminat din document. Pentru a în condiții de siguranță set de valori pe DOM obiecte fără memorie scurgeri de informații, de a folosi .date().