JS：如果特定值在該行中，則顯示特定的錶行

我試圖here在檢查框被拒絕時僅顯示某些行。JS：如果特定值在該行中，則顯示特定的錶行

例如，只有包含2.5的行作爲值，如果複選框2.5被拒絕。

我不能編輯表的HTML代碼和我想這樣的事情全無結果：

$('input[name="rooms_check"]').change(function(){ 
$('input[name="rooms_check"]').each(function(){ 
    if(!$(this).prop('checked')) { 
     $('tr td:nth-child(2):contains("'+$(this).val()+'")').hide(); 
    } else { 
     $('tr td:nth-child(2):contains("'+$(this).val()+'")').show(); 
    } 
}); 
});

HTML：（我只能編輯<input> HTML）

<input type="checkbox" name="rooms_check" value="2.5"> 
<input type="checkbox" name="rooms_check" value="3.5"> 
<input type="checkbox" name="rooms_check" value="4.5">

任何提示？

PS：我正在使用Wordpress。

來源

2016-07-21 A.Casa

你應該在這個崗位，這是關於WordPress的標籤提，因爲它小號強烈地限制了你的問題的可能答案。 – FvB

我剛剛編輯了標籤:) –

此代碼應該工作：

$('input[name="rooms_check"]').change(
    function(){ 
    // a checkbox is clicked > display affected rows 
    if(0<$('input[name="rooms_check"]:checked').length){ 
     // hide all rowsin body 
     $('#tablepress-5 tbody tr').css('display', 'none'); 

     // display the rows with the correct values 
     $('input[name="rooms_check"]').each(function(){ 
     if($(this).prop('checked')) { 
      $('#tablepress-5 td:nth-child(2):contains("'+$(this).val()+'")').parent().css('display', 'table-row'); 
     } 
     }); 
    } 
    // no checkboxes clicked > display all rows 
    else{ 
     $('#tablepress-5 tbody tr').css('display', 'table-row'); 
    } 
});

小提琴：https://jsfiddle.net/5kt3fegy/
- 忽略的onclick = 「changeRows（）」中的HTML的部分的小提琴-例子 - 它是一個測試的代碼靜止我忘了刪除... ;-)

注：我還添加了「不再複選框激活」

來源

2016-07-21 08:20:23 SusiMage

JS：如果特定值在該行中，則顯示特定的錶行

回答

相關問題