【问题标题】:I want to hide table row of particular cells我想隐藏特定单元格的表格行
【发布时间】:2014-04-10 08:49:49
【问题描述】:

我创建了一个脚本,用于隐藏包含特定单词的行,在我的情况下,该单词是“活动的”。现在的问题是脚本只隐藏第一行,然后停止执行。所以基本上它可以工作,但在隐藏第一行后,它停止执行。

欢迎提出建议

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
   <table id="myTable">
     <tr id="my">
            <td>1</td>
            <td>11</td>
            <td >active</td>
        </tr>
     <tr  id="my">
            <td>2</td>
            <td>22</td>
            <td>active</td>
        </tr>
        <tr  id="my">
            <td>4</td>
            <td>44</td>
            <td>inactive</td>
        </tr>
        <tr  id="my">
            <td>5</td>
            <td>55</td>
            <td>inactive</td>
        </tr><tr  id="my">
            <td>6</td>
            <td>66</td>
            <td>active</td>
        </tr>
        <tr  id="my">
            <td>7</td>
            <td>77</td>
            <td>inactive</td>
        </tr>
    </table>
<script>
var oTable = document.getElementById('myTable');
var row = "active";
var count=0;
var rowLength = oTable.rows.length;
//document.writeln("no fo row in table"+rowLength); 
    for (var i = 0; i < rowLength; i++)
    {
        var oCells = oTable.rows.item(i).cells;
         var cellLength = oCells.length;
         //document.writeln(count);
         count=count+1;    
         for(var j = 0; j < cellLength; j++)
            {
                var cellVal = oCells.item(j).innerHTML;     
            //  document.writeln("table values"+cellVal);
                 if(cellVal==row)
                     {
                                document.getElementById('my').style.display = 'none'; 
                                document.writeln("table values"+count+"<br/>");                             
                     }  
                else
                    {

                    }
                }
    }
</script>

【问题讨论】:

  • 你能给我点这个吗....
  • 您的 HTML 无效; id 只能使用一次。您应该使用类名。

标签: javascript jquery html for-loop


【解决方案1】:
$('#myTable tr').each(function() {
    var st = $(this).find("td:last").html();    
    if(st!='active'){
    $(this).hide();
    }
});

【讨论】:

  • 如果有更多诸如活动、启用、禁用之类的词我必须比较一下代码是什么样的
  • 这段代码适用于静态数据,但问题是我的数据来自数据库,所以基本上我想隐藏动态数据。有可能吗?
  • 动态数据??隐藏什么??
【解决方案2】:

我建议,尽管您已经接受了答案:

$('#myTable tr').filter(function(){
    return $(this).find('td:last-child').text().toLowerCase() === 'active';
}).hide();

JS Fiddle demo.

关于您的进一步问题(在 cmets 中对另一个答案):

如果有比活动、启用、禁用之类的词更多的词,我想可以帮助我,我必须比较一下代码是什么样的

我建议采用以下方法:

var states = {
    'active' : {
        'display' : 'none'
    },
    'inactive' : {
        'color' : 'orange'
    }
};


$('#myTable tr td:last-child').each(function(){
    var that = this,
        $that = $(that);
    $that
     .parent()
     .css(states[$that.text().toLowerCase()] || '');
});

JS Fiddle demo.

【讨论】:

  • 这段代码适用于静态数据,但问题是我的数据来自数据库,所以基本上我想隐藏动态数据。有可能吗?
  • 是的,但如果没有更多信息,我不能说如何。您可能想发布有关该方面的新问题,包括相关详细信息。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2015-11-06
  • 2014-09-06
  • 1970-01-01
  • 1970-01-01
  • 2019-05-23
  • 1970-01-01
  • 2012-08-14
相关资源
最近更新 更多