表格中的最後一列不可點擊

我目前有一個非常瘋狂的代碼，可以在動態表格中單擊並展開行。我的問題是我需要讓表格中的最後一列不可點擊，我不知道該怎麼做。我搜索了互聯網，嘗試了不同的東西，但似乎沒有任何幫助。表格中的最後一列不可點擊

這是我的表：

<table id="myTable"> 
        <tr> 
         <th>Name</th> 
         <th>Type</th> 
         <th>Details</th> 
        </tr> 
      {{#each companies}} 

        <tr class="record"> 
         <td> 
          {{this.name}} 
         </td> 
         <td> 
          {{this.type}} 
         </td> 
         <td id="details"> 
          <img style="height: 20px; width: 20px" src="img/arrow_right.png"> 
        </td> 
       </tr> 
     {{/each}} 
    </table>

我要做出最後一列（ID = 「細節」）不能點擊。

這是我的瘋狂點擊事件：

$("#myTable").on("click", "tr.record", function() { 
      var rowIndex = this.rowIndex, 
        services = null; 
      var self = this; 
      $.ajax({ 
       url: "api/relation", 
       type: 'GET', 
       success: function (response) { 
        if (response[rowIndex - 1].relationStats) { 
         services = response[rowIndex - 1].relationStats.PROVIDES_SERVICE; 
        } 

        if (services > 0 && $(self).hasClass('record active')) { 
         console.log("CLOSING"); 
         $(self.nextSibling).remove(); 
         $(self).removeClass('active'); 

        } else if (services > 0) { 
         console.log("OPENING"); 
         var openDetails = $('<tr/>').addClass('openDetails').insertAfter(self); 
         $(self).addClass('active'); 
         var td = $('<td/>').addClass('td').appendTo(openDetails); 
         $('<p/>').html("Provides service(s):&nbsp").appendTo(td); 
         $('<td/>').html(services).appendTo(openDetails); 

        } 
       } 
      }); 
     });

任何幫助，將不勝感激！

來源

2013-08-23 Ole Jørgen Blom

不是註冊的點擊處理程序tr使用td和篩選出最後孩子

$("#myTable").on("click", "td:not(:last-child)", function() { 
    var self = $(this).closest('tr').get(0), rowIndex = self.rowIndex, 
     services = null; 
    $.ajax({ 
     url: "api/relation", 
     type: 'GET', 
     success: function (response) { 
      if (response[rowIndex - 1].relationStats) { 
       services = response[rowIndex - 1].relationStats.PROVIDES_SERVICE; 
      } 

      if (services > 0 && $(self).hasClass('record active')) { 
       console.log("CLOSING"); 
       $(self.nextSibling).remove(); 
       $(self).removeClass('active'); 

      } else if (services > 0) { 
       console.log("OPENING"); 
       var openDetails = $('<tr/>').addClass('openDetails').insertAfter(self); 
       $(self).addClass('active'); 
       var td = $('<td/>').addClass('td').appendTo(openDetails); 
       $('<p/>').html("Provides service(s):&nbsp").appendTo(td); 
       $('<td/>').html(services).appendTo(openDetails); 

      } 
     } 
    }); 
});

來源

2013-08-23 07:03:00

我已經試過了，不起作用。我得到這個錯誤：「未捕獲的類型錯誤：無法讀取屬性'關係數據庫的'未定義的」 –

@OleJørgenBlom與'rowIndex'有關的小修改完成 –

您先生，非常棒！謝謝：） –

$("#myTable").on("click", "#details", function (e) { 
    e.stopPropagation(); 
});

來源

2013-08-23 07:15:00

我認爲你應該使用

$("#myTable").on("click", "td:not(:last)", function() {.....}

，而不是not(:last-child)，如果情況是：

<tr> 
    <td>....</td> 
    <td>....</td> 
    <td class="not record">....</td> 
</tr> 
<tr> 
    <td>....</td> 
    <td>....</td> 
    <td class="record">....</td> 
</tr>

參考last-child，last

來源

2013-08-23 09:43:06

表格中的最後一列不可點擊

回答

相關問題