显示/隐藏所选表格

时间:2019-01-21 16:13:27

标签: javascript jquery

我做了一个工作示例,我知道行数。如果布尔值为false,则基本显示1和2行,如果为true,则基本隐藏。单击功能显示和隐藏。

现在我想做同样的事情。但是现在我不知道有多少行,并且我正在尝试使用this

 var database = firebase.database();
 database.ref("orders").once('value', function(snapshot) {
     if (snapshot.exists()) {
         var content = '';
         snapshot.forEach(function(data) {
             var val = data.val();
             var degis = val[5].replace("pips", "     ");
             var tss = degis.substring(0, 7);
             content += ' < tr class = "zurna" onclick = "changevisible(this)" >';
             content += ' < td > ' + val[0] + ' < /td>';
             content += ' < td > ' + val[1] + ' < /td>';
             content += ' < td > ' + val[4] + ' < /td>';
             content += ' < td class = "zal" > ' + tss + ' < /td>';
             content += ' < /tr>';
             content += ' < tr id = "subinfo1" class = "altbilgi" onclick = "changevisible(this)" >';
             content += ' < th colspan = "2" class = "altsol" > '  + "Date open:" +' < /th>';
             content += ' < th colspan = "2" class = "datekoy" > ' + val[2] + ' < /th>';
             content += ' < /tr>';
             content += ' < tr id = "subinfo2" class = "altbilgi" onclick = "changevisible(this)" >';
             content += ' < th colspan = "2" class = "altsol" > '  + "Date close:" +' < /th>';
             content += ' < th colspan = "2" class = "datekoy" > ' + val[3] + ' < /th>';
             content += ' < /tr>';
         });
         $('#ex-table').append(content);
     }
     $('.zal').each(function() {
         if (parseInt($(this).text().trim()) < 0) {
             $(this).addClass('redback');
         } else if (parseInt($(this).text().trim()) > 0) {
             $(this).addClass('greenback');
         }
     });
 });

 function changevisible(id) {
     id.getElementById("subinfo1").style.visibility = "collapse";
     id.getElementById("subinfo2").style.visibility = "collapse";
 }
 It 's says "id.getElementById is not a function"

1 个答案:

答案 0 :(得分:0)

我用来显示和隐藏表格行的方式如下:

  1. 将onclick方法添加到<tr>

    <tr onclick="selectedRow(val)">

  2. 添加禁用的属性,然后将方法isSelected(val)调用到<tr>

    <tr onclick="selectedRow(val)" disabled="isSelected(val)">

JavaScript中的方法:

var selectedItem;

selectedRow = function(val) {
    selectedItem = val;
}

isSelected = function(val) {
    return val == selectedItem;
}