Javascript 禁用特定列的location.href

我已经构建了一个脚本，使我的数据表的行可以点击

当我单击一行时，浏览器会将我导航到位置：./test.php？id=

现在的问题是，我有一个列，其中有一个复选框。当我在复选框上计时时，脚本还会将我导航到该位置

我想使第二列（目标1）不“可点击”。当我单击第二列时，脚本不应该将我导航到位置：./test.php？id=

有人知道我是怎么做到的吗

这是我的密码：

<script type="text/javascript">
 $( document ).ready(function() {
  $('grid1').DataTable({
   "bprocessing": true,
   "serverSide": true,
        "ajax": {
            "url": "response1.php",
            "type": "POST",
            "error": function(){
                $("#grid_processing").css("display","none");
            }
        },
        "columnDefs": [ 
            { "targets": 0, "render": function ( data, type, full, meta ) { return  ' '+data+' '} },
            { "targets": 1, "render": function ( data, type, full, meta ) { return  '<div class="checkbox c-checkbox"><label><input type="checkbox" class="sel1"/><span class="fa fa-check"></span></label></div>'} },
            { "targets": 2, "render": function ( data, type, full, meta ) { return  ' '+data+' '} },
            { "targets": 3, "render": function ( data, type, full, meta ) { return  ' '+data+' '} },
            { "targets": 4, "render": function ( data, type, full, meta ) { return  ' '+data+' '} },
            { "targets": 5, "render": function ( data, type, full, meta ) { return  ' '} }
        ]                                    
  });   
 });
</script>

$（文档）.ready（函数（）{
$（'grid1'）.DataTable({
“bprocessing”：正确，
“服务器端”：正确，
“ajax”：{
“url”：“response1.php”，
“类型”：“职位”，
“错误”：函数（）{
$（“网格处理”）.css（“显示”、“无”）；
}
},
“columnDefs”：[
{“目标”：0，“呈现”：函数（数据、类型、完整、元）{return'+data+''}，
{“目标”：1，“呈现”：函数（数据、类型、完整、元）{return'}，
{“目标”：2，“呈现”：函数（数据、类型、完整、元）{return'+data+''}，
{“目标”：3，“呈现”：函数（数据、类型、完整、元）{return'+data+''}，
{“目标”：4，“呈现”：函数（数据、类型、完整、元）{return'+data+''}，
{“目标”：5，“呈现”：函数（数据、类型、完整、元）{return'}
]                                    
});   
});

以下是创建可单击行的脚本：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
  $(document).ready(function() {

    var table = $('#grid1').DataTable();    
    $('#grid1').on( "click", "td", function (e) {
      var rowIdx = table.row( this ).index();
      var sData = table.cells({ row: rowIdx, column: 5 }).data()[0];
      if (sData && sData.length) {
        location.href = './test.php?id=' + sData;
      }
    });

  });
</script>

$（文档）.ready（函数（）{
var table=$（'#grid1'）.DataTable（）；
$（'#grid1'）。在（“单击”，“td”，函数（e）{
var rowIdx=table.row（this.index（）；
var sData=table.cells（{row:rowIdx，column:5}）.data（）[0]；
if（sData和sData.length）{
location.href='./test.php？id='+sData；
}
});
});

您可以尝试将单击选择器更改为

$('#grid1').on( "click", "td:not(:nth-child(2))", function (e) {
      var rowIdx = table.row( this ).index();
      var sData = table.cells({ row: rowIdx, column: 5 }).data()[0];
      if (sData && sData.length) {
        location.href = './test.php?id=' + sData;
      }
    });

---

实际上，您正在使用脚本使每个单元格都可以单击（目标是

td

，而不是

tr

），因此只需检查它在哪个列中，如果它在您不希望单击的列中，请返回false而不是设置

location.href

。