如何啓用超鏈接打開模式對話框，同時允許在同一鏈接上的新標籤中打開

我正在開發一個網頁。在網頁上是超鏈接，稱爲「查看頁面」。一旦點擊，目標是這將在模態對話框中顯示鏈接到頁面。如何啓用超鏈接打開模式對話框，同時允許在同一鏈接上的新標籤中打開

這裏是我使用這個實現代碼：

<!doctype html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title> Test</title> 
     <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js"></script> 

     <script> 
      function OpenModal() { 
       $("#divModal").dialog({ 
        autoOpen: false, modal: true, title: 'Modal', width: 'auto', height: 'auto' 
        , buttons: { "Cancel": function() { $(this).dialog("close"); } }, 
       }).dialog('open'); 
       return false; 
      } 
     </script> 
    </head> 

    <body> 
     <a href="#" onclick="javascript:OpenModal();">View Page</a> 
     <div style="display:none;" id="divModal"> 
      <iframe id="myIframe" src="SomeValidURL" width="1100" height="800" /> 
     </div> 
    </body> 
</html>

有沒有辦法類似於下面可以實現以允許用戶點擊右鍵查看頁面鏈接上的功能，選擇「在新標籤中打開」或在新窗口中打開並有SomeValidUrl在新的標籤頁或新窗口中打開？如果用戶左鍵點擊SomeValidUrl頁面應該在模式對話框中打開。

來源

2013-03-14 fin

我會刪除'onclick'，然後使用正常的點擊事件，然後檢測它是什麼類型的點擊事件（左，右或中）並作出相應的反應。（提示：你只想打開左鍵單擊模式）。還需要將該url添加到href。 – 2013-03-14 15:44:26

所有你得到的原因是在選項卡中打開的主頁，是因爲你的'href =「＃」'。 – Sunyatasattva 2013-03-14 15:58:52

return false確實沒有問題。其實你應該！如果您沒有return false或preventDefault您的模式將打開，然後鏈接將觸發，轉發到其他頁面。

如果你希望這只是工作，如果用戶直接通過鏈接點擊他的方式在新窗口/選項卡中打開它，它是足以讓你把SomeValidURL（你已經在你的iframe的src屬性）爲a元素的href屬性。另外，作爲一般技巧，避免綁定事件內聯;而是使用jQuery.on：它更靈活，它堅持分離問題的最佳實踐，它確實有助於解決混亂問題。

來源

2013-03-14 15:49:05 Sunyatasattva

+1：正確。歡迎來到1k！ – 2013-03-14 17:18:08

哈哈謝謝，我很享受999的聲譽：有趣的巧合。 – Sunyatasattva 2013-03-14 17:19:12

點擊任意帖子得分！你會驚訝。 – 2013-03-14 17:21:31

向鏈接添加一個類然後使用它。

$(".link").mousedown(function(event) { 
     switch (event.which) { 
      case 1: 
       //modal code 
       break; 
      case 3: 
       window.open("http://www.google.com", '_blank'); 
       break; 
      default : 
       window.open("http://www.google.com", '_blank'); 
       break; 
     } 
     return false; 
    });

演示：http://jsfiddle.net/calder12/Er7NN/

來源

2013-03-14 16:02:42

然後允許正常使用的聯繫，與href屬性：

<a href="SomeValidURL" onclick="javascript:OpenModal();">View Page</a>

儘管return false，這仍然應該工作，因爲你的click處理不涉及右鍵單擊並從瀏覽器呈現的上下文菜單中選擇「在新選項卡中打開」。

來源

2013-03-14 17:16:15

如何啓用超鏈接打開模式對話框，同時允許在同一鏈接上的新標籤中打開

回答

相關問題