Jquery：表行隐藏和显示有问题吗？

在下面的程序中，当且仅当选中相关复选框时，我才显示表格行。如果并且仅当相关复选框未选中时，我才隐藏表行

这是我的复选框定义：

                 <div id="cb">
                    <input type="checkbox" value="air india">
                    <input type="checkbox" value="king fisher">
                    <input type="checkbox" value="Go Air">
                 </div>

示例：如果单击第一个复选框，将显示包含值“air india”的表格行。如果我取消选中，它将隐藏

这里隐藏工作正常，但显示工作不正常。缺少内部表。下面是我的密码

         <script type="text/javascript" src="jquery.js"></script>
         <script type="text/javascript">
         $(document).ready(function()
         {
                function inArray(haystack, needle)
                {

                   var found = false;
                   $.each(haystack, function(i, elem)
                   {
                      if(elem === needle)
                      {
                            found = true;
                            return false;
                      }
                  });
                  return found;
              }



             $("#cb").find('input:checkbox').click(function()
             {
                 var myArray =new Array();
                 $("#cb").find('input:checkbox').each(function(index)
                 {
                        if($(this).attr("checked")==true)
                        {
                              myArray.push($(this).val());
                        }

                });
                $('#abc tr').each(function()
                {
                     var td = $('> td:nth-child(2)', this);
                    if(!inArray(myArray, td.text()))
                    {
                            $(this).hide();
                    }
                    else
                    {
                            $(this).show();
                    }
               });

             });

          });

         </script>

           <table id="abc" border="1">
                <tr >
                     <td></td>
                     <td>air india</td>
                     <td>
                          <table>
                             <tr>
                                <td>Hai</td>
                             </tr>
                          </table>
                     </td>
                 </tr>
                <tr>
                     <td></td>
                     <td>king fisher</td>
                     <td>
                         <table>
                            <tr>
                                <td>Hai</td>
                            </tr>
                         </table>
                     </td>
                </tr>
                <tr>
                     <td></td>
                     <td>Go Air</td>
                     <td>
                          <table>
                             <tr>
                                <td>Hai</td>
                             </tr>
                          </table>
                    </td>
               </tr>
             </table>

           <div id="cb">
                <input type="checkbox" value="air india">
                <input type="checkbox" value="king fisher">
                <input type="checkbox" value="Go Air">
           </div>

$（文档）.ready（函数（）
{
功能（干草堆、针）
{
var=false；
$。每个（干草堆，函数（i，元素）
{
如果（元素===指针）
{
发现=真；
返回false；
}
});
发现退货；
}
$（“#cb”）。查找（'输入：复选框'）。单击（函数（）
{
var myArray=新数组（）；
$（“#cb”）.find（'input:checkbox'）。每个（函数（索引）
{
if（$（this.attr（“checked”）==true）
{
myArray.push（$（this.val（））；
}
});
$（'#abc tr'）。每个（函数（）
{
var td=$（'>td:n个子项（2）”，此项）；
如果（！inArray（myArray，td.text（）））
{
$（this.hide（）；
}
其他的
{
$（this.show（）；
}
});
});
});
印度航空
海
费舍尔国王
海
放风
海

我认为您总是从这个函数返回false

function inArray(haystack, needle)
            {

               var found = false;
               $.each(haystack, function(i, elem)
               {
                  if(elem === needle)
                  {
                        found = true;
                        return false;
                  }
              });
              return found;
          }

我想他们可能会喜欢这个

                  if(elem === needle)
                  {
                        found = true;
                        return found;                            
                  }

---

我首先使用jQuery.inArray（）-函数，而不是自己创建

---

但这不是你的问题，$（“#abc tr”）也会选择内部表中的tr，并直接隐藏它们。

这应该很容易：

$('#cb > input:checkbox').click(function(){
    $('#abc').find('tr:contains("' + $(this).val()+ '")').toggle(this.checked);
})

现场示例：

这有什么帮助吗

<div id="cb">
    <input type="checkbox" id="air-india-box" value="air india">
    <input type="checkbox" id="king-fisher-box" value="king fisher">
    <input type="checkbox" id="go-air-box" value="Go Air">
</div>

<p id="air-india"><br />Air India <br />Hai<br /><br /></p>
<p id="king-fisher"><br />King Fisher <br />Hai<br /><br /></p>
<p id="go-air"><br />Go Air <br />Hai<br /><br /></p>


$('#air-india').hide();
$('#king-fisher').hide();
$('#go-air').hide();

$("#air-india-box").click(function () { 
    $("#air-india").toggle();
});

$("#king-fisher-box").click(function () { 
    $("#king-fisher").toggle();
});

$("#go-air-box").click(function () { 
    $("#go-air").toggle();
});

印度航空公司


king fisher
Hai



go air
Hai


$（'印度航空公司'）.hide（）；
$（“#渔王”）.hide（）；
$（'goair'）.hide（）；
$（“#印度航空箱”）。单击（函数（）{
$（“#印度航空”）.toggle（）；
});
$（“#king fisher box”）。单击（函数（）{
$（“#翠鸟”）.toggle（）；
});
$（“#go air box”）。单击（函数（）{
$（“#起飞”）.toggle（）；
});

---

jsIDLE:

您确定.attr（“checked”）返回的值正确吗？谢谢。伟大的代码。但我不明白为什么我的程序不起作用。内部表也在其中一个邮件中。为什么它不起作用直到你决定在“印度航空”的细节中的某个地方用“Go Air”这个名字。表没有显示，因为它的所有tr都被隐藏了，表本身是可见的。