Question

我正在使用bootstrap，我在那里有一个可点击的行。单击该行时，将打开model。就像下面一样。

<tr class='clickable-row' data-toggle="modal" data-target="#editModal" style="cursor:pointer">

但是在这一行中，有一个包含按钮的列。问题是点击按钮，但由于整个行都是可点击的，model首先打开，然后执行按钮的命令。

下面是按钮列。

<td>
  <form>
     <label>
         <input type="submit" name="buttonActDea" id="button" class="btn btn-primary" value="Activate">
      </label>
   </form>
</td>

如何制作＆＃34;可点击的行＆＃34;功能仅对按钮列不可用？

Answer 1

您可以使用jquery的stopPropagation();

$('#button').on('click',function(e) {
    //button function

    e.stopPropagation();
})

或删除数据属性，以便tr的点击事件如果有button孩子

，则不会触发

$( document ).ready(function() {
   $('.clickable-row').each(function () {
   if ( $(this).find('#button').length)
     {
       $(this).removeAttr('data-toggle').removeAttr('data-target');
     }
   });
});

如何使特定列的bootstrap clickable-row不可用？

1 个答案: