针对精确的文本匹配（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();