2

完全に一致するテキストで複数のクラスをターゲットにする必要があります。コードの半分は機能しているように見えますが(チェックボックスがオフの場合、テキストの背景は紫色になります)、チェックボックスをオンにしてテキストをターゲットにすると、何も起こらないようです...

if ($("input:checkbox:checked#checkbox-id").length > 0) {
        $('#main-content-panel .entry').filter(function(index) { 
        return $(this).text() == "Text"; }).css
        ('backgroundColor', 'orange'); 
        }

if ($("input:checkbox:not(:checked)#checkbox-id").length > 0) {
        $('#main-content-panel .entry').filter(function(index) { 
        return $(this).text() == "Text"; }).css
        ('backgroundColor', 'purple'); 
        }

jsFiddle: http: //jsfiddle.net/KKfEF/

4

2 に答える 2

4

changeイベントを聞く必要があります:

var $elem = $('#main-content-panel .entry').filter(function (index) {
    return $(this).text() == "Text";
});
$('#checkbox-id').change(function () {
    var color = this.checked ? 'orange' : 'purple';
    $elem.css('backgroundColor', color);
}).change();

http://jsfiddle.net/drcpY/

于 2013-01-25T00:23:28.590 に答える
1

onchangeイベントハンドラーを追加するのを忘れました。

onchange="run()">

次のように、コードも関数でラップします

run = function () {
if ($("input:checkbox:checked#checkbox-id").length > 0) {
            $('#main-content-panel .entry').filter(function(index) { 
            return $(this).text() == "Text"; }).css
            ('backgroundColor', 'orange'); 
            }

if ($("input:checkbox:not(:checked)#checkbox-id").length > 0) {
            $('#main-content-panel .entry').filter(function(index) { 
            return $(this).text() == "Text"; }).css
            ('backgroundColor', 'purple'); 
            }
}
run();
于 2013-01-25T00:27:59.980 に答える