更改基於某些DIV內容的CSS

希望有人可以幫我一點jQuery或JavaScript。我有一些DIV包含一個複選框的值取決於我是否勾選或不是不是「1」或「0」的：更改基於某些DIV內容的CSS

<div class="checkbox">1</div> //This is when the checkbox is checked 

<div class="checkbox">0</div> //This is when the checkbox is NOT checked

這個DIV的類保持不變，無論是0或1，所以我需要有一個有條件的聲明說，

「如果DIV的內容是1，那麼表明它」

和

「如果DIV的內容是0，然後隱藏它「

這會很簡單嗎？

來源

2013-01-15 Dan

這將是更好地給另一個班的每個元素，像「當覈對」一和「未檢查時」。不得不在內容中查看DOM是混亂和慢的（雖然性能可能不會成爲真正的問題）。 – Pointy

的過濾器會派上用場這種情況下..

$('.checkbox').filter(function() { 
    return $(this).text() == 0; 
}).hide();

來源

2013-01-15 17:42:34

如果在此過濾器運行後更改該怎麼辦 – Chad

將其放入更改監聽器中，如我的答案。我會結合我的和維加的答案（雖然他配得上答案） – idrumgood

@idrumgood，不同意。除非事件已被觸發，否則你的程序不會運行 – Alexander

我會做不同的。

$("input#checkbox").change(function(){ 
    $("div.checkbox").toggle(this.checked); 
});

考慮到您的複選框是它改變<div>的內容反正之一。

來源

2013-01-15 17:43:06 Alexander

我想他想顯示'div.checkbox'文本內容'1'並隱藏'div.checkbox'文本內容'0' –

我同意你在這方面的答案，你比我快，雖然 – Alexander

任何時候複選框被改變，看看你的div類checkbox，如果他們有1，顯示，否則隱藏。

$('input[type="checkbox"]').on('change', function() { 
    $('.checkbox').each(function(){ 
     if($(this).text() === '1'){ 
      $(this).show(); 
     }else{ 
      $(this).hide(); 
     } 
    }); 
});

來源

2013-01-15 17:43:58 idrumgood

雖然我的作品，@Vega的答案更清晰，並且與我的'.each（）'函數完全相同。 – idrumgood

-1

您可以使用:contains() Selector根據其內容選擇div。

$('div.checkbox:contains("1")').show(); 
$('div.checkbox:contains("0")').hide();

來源

2013-01-15 17:44:29 matthewtole

應該非常小心地使用包含，以防止誤報 – Alexander

同意，但丹指出，內容只有「1」或「0」，所以你很難得到誤報。 – matthewtole

同意。儘管如此，警告信息總是好的 – Alexander

如果我必須這樣做，那麼我很願意這樣做：http://jsfiddle.net/P2WmG/

var chktxt = $.trim($('.checkbox').text()); 
if (chktxt == 0) { 
    $('#checkbox').hide(); 
} else { 
    $('#checkbox').show(); 
}

來源

2013-01-15 17:55:13 Jai

剛剛更新了答案。 – Jai

更改基於某些DIV內容的CSS

回答

相關問題