Tri-state kontrol düğmesi (Evet, Hayır, boş) HTML için yolu yok, değil mi?

Kendine göre her şeyi işlemek zorunda kalmadan bir hile ya da alternatif çözüm herhangi bir basit var mı?

Edit

Troelsen yorum Janus sayesinde, daha iyi bir çözüm buldum.

HTML5 kutularını indeterminate adında bir özelliği tanımlar

w3c reference guide bkz. Checkbox görsel olarak belirsiz görünmesi için true olarak ayarlayın:

element.indeterminate = true;

Burada Janus Troelsen's fiddle. Ancak unutmayın:

• indeterminate devletin HTML biçimlendirme ayarlayın, Javascript (JSfiddle test detailed article in CSS tricks Bu bu bakınız) yoluyla yapılabilir

• Bu devlet checkbox değerini değiştirmez, sadece maskelerini giriş gerçek durumunu görsel bir işaret.

• Tarayıcı testi: 15, 12 Opera Firefox 22, Krom benim için Çalıştı ve IE 7 için geri. Mobil tarayıcılar hakkında, iOS 3.1 Android 2.0 tarayıcı ve Safari mobile desteği yok.

Önceki cevap

Başka bir alternatif "bazı seçilmiş" (Gmail gibi . devlet için checkbox şeffaflık ile oynamak olurdu ^grev>yokönceki sürümlerde yapmak için kullanılır). Biraz javascript ve CSS sınıfı gerektirir. Burada işaretlenerek seçilebilir öğeler ve hepsi/hiçbiri seçmek için izin veren bir onay kutusu ile bir liste işleyen belirli bir örnek koydum. Bu kutucuk "seçilen" listesinde bazı öğeleri seçili olduğunda devlet. bir gösterir

KİMLİK #select_all bir onay kutusu ve bir sınıf .select_one çeşitli onay kutuları verildi

Erbabı CSS sınıf "tümünü seç" onay kutusunu aşağıdaki gibi olacaktır:

.some_selected {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

Ve tüm checkbox select tri-state işleyen JS kodu şudur:

$('#select_all').change (function ()
{
    //Check/uncheck all the list's checkboxes
    $('.select_one').attr('checked', $(this).is(':checked'));
    //Remove the faded state
    $(this).removeClass('some_selected');
});

$('.select_one').change (function ()
{
    if ($('.select_one:checked').length == 0)
        $('#select_all').removeClass('some_selected').attr('checked', false);
    else if ($('.select_one:not(:checked)').length == 0)
        $('#select_all').removeClass('some_selected').attr('checked', true);
    else
        $('#select_all').addClass('some_selected').attr('checked', true);
});

Buradan deneyebilirsiniz: http://jsfiddle.net/98BMK/

Bu yardımcı olur umarım!