jquery - 以精确文本匹配为目标 (jQuery)

Question

我需要通过精确的文本匹配来定位多个类。我的一半代码似乎有效（未选中复选框时文本具有紫色背景），但是在选中复选框以定位文本时，似乎没有发生任何事情...

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/

Answer 1

您应该收听该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/

Answer 2

您忘记添加 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();