引導模式防止右鍵

Question

我嘗試在鼠標右鍵上防止默認，並且它工作正常，直到我嘗試打開引導模式。

如果我使用「alert」和og，則不會執行右鍵操作，但是當我打開bootstrap模式時，它不是。我試圖谷歌它，但我找不到我的答案。

$(".timer").on("contextmenu", function(evt) {evt.preventDefault();}); 

    $(".timer").mousedown(function(e){ 
     // $(".timer").bind('contextmenu', function(){ return false }); 
     e.preventDefault(); 

     if(e.button == 2) { 
      e.preventDefault(); 
      $('#changeTime').modal('show'); // rightclick is NOT prevented. 
      // alert('Hello'); // this works...? 
      return false; 
     } 
     return true; 
    }); 

任何人都可以幫我嗎？謝謝。

的PHP是：

echo '<td class="description" name="id' . $todos->id . '"> 
    <span class="descriptionText'.$todos->id.'">' 
    . $todos->description . '</span></td><td style="width:50px;"> 
    <span class="timer pull-right btn btn-primary" name="id'.$todos->id.'"> 
    ' . show_time($todos->total_time) . '</span></td></tr>'; 

的HTML模式是：

<div class="modal fade" id="changeTime" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
     <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button> 
      <h4 class="modal-title" id="myModalLabel">Change time</h4> 
      </div> 
      <div class="modal-body"> 
       <form> 
        // A lot of HTML :) 
       </form> 
      </div> 
      <div class="modal-footer"> 
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
      <button type="button" class="btn btn-primary">Save changes</button> 
      </div> 
     </div> 
     </div> 
    </div> 

Answer 1

因此，基於下面的評論，我覺得我應該更新我的答案。

您希望忽略默認點擊並允許使用右鍵單擊來顯示模式。

爲了要做到這一點，你需要屏蔽所有的東西，一個默認的點擊會做使用preventDefault()和stopPropagation()

$("[data-toggle='modal']").click(function (e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
}); 

你要綁定的模式開啓功能到之後右鍵單擊事件，但不顯示上下文菜單。

$("[data-toggle='modal']").on("contextmenu", function(e) { 
    e.preventDefault(); // don't show the context menu 
    $("#changeTime").modal("show"); // show the modal window 
}) 

Here's a CodePen of it working