2014-04-24 42 views
0

我使用this來測試表單是否髒。 默認爲標準瀏覽器確認,詢問您是否確定要從此頁面導航。在jQuery的dirtyforms網站上有一個部分,說你可以使用jquery ui模式表單。jquery髒記錄,想要jquery ui模式

所以,我想,像這樣添加一個部分(一個div):

<div id="unsavedChanges" title="Save Changes?"> 
      <p>You've made changes to this page. Do you want to leave this page without saving?</p> 
     </div> 

然後我說看起來像什麼他們的代碼:

$.DirtyForms.dialog = { 
     selector: '#unsavedChanges', 
     fire: function(message, dlgTitle) { 
      $('#unsavedChanges').dialog({ title: dlgTitle, width: 350, modal: true }); 
      $('#unsavedChanges').html(message); 
     }, 
     bind: function() { 
      $('#unsavedChanges').dialog('option', 'buttons', 
       [ 
        { 
         text: "Stay Here", 
         click: function(e) { 
          $.DirtyForms.choiceContinue = false; 
          $(this).dialog('close'); 
         } 
        }, 
        { 
         text: "Leave This Page", 
         click: function(e) { 
          $.DirtyForms.choiceContinue = true; 
          $(this).dialog('close'); 
         } 
        } 
       ] 
      ).bind('dialogclose', function(e) { 
       // Execute the choice after the modal dialog closes 
       $.DirtyForms.choiceCommit(e); 
      }); 
     }, 
     refire: function(content) { 
      return false; 
     }, 
     stash: function() { 
      return false; 
     } 
    }; 

雖然我不知道他們想要我(我最初把它放在document.ready之外,然而,在運行這個並對我的表單進行更改並導航之後,我發現它仍然使用瀏覽器確認而不是jquery ui對話框。 ?

+0

hmmmm。通過閱讀文檔,我明白這是從他引用jquery 1.4.2和1.7.2開始就有點古怪了。從那以後,jquery和jquery ui都開始有了。任何人,你可以發佈一個這樣的小提琴,所以我們可以玩它使用jQuery和你使用的jQuery UI的版本? – Rooster

+0

這看起來像一個更新的等效:http://plugins.jquery.com/are-you-sure/ – Anthony

+0

是否有瀏覽器相關的安全問題,實際上需要您使用瀏覽器確認對話框?我認爲除了通過onbeforeunload事件(它只能返回一個字符串)之外,瀏覽器無法通過JavaScript進行瀏覽。 –

回答

0

自述:當他們試圖離開一個頁面,而不提交他們已將數據輸入表單

骯髒的形式將提醒用戶。它在一個模式彈出框中提醒他們,並且回退到瀏覽器的默認onBeforeUnload處理程序,用於文檔範圍之外的事件,如,但不限於,頁面刷新和瀏覽器導航按鈕。

(重點煤礦)

如果要顯示這樣的事情一個模式,那麼,你根本不可能。 (之所以是安全的原因:很容易想象一個頁面阻止用戶關閉它,無論他們嘗試什麼,都不會殺死瀏覽器實例。)

此外,「但不限於」位很吸引人:我會請向插件的作者詢問具體內容,因爲它可能與您的使用案例重疊。

3

您可以只有彈出,如果用戶試圖通過點擊您的頁面上的錨或其他元素留下一個自定義對話框。

然後,你可以截獲所有錨點等點擊,防止它,彈出一個自定義對話框來確認。換句話說,當有人點擊你網頁上的一個元素時,你可以控制,並且可以做任何你想做的事情。

然而,當用戶試圖通過關閉選項卡或瀏覽器離開,你無法用JavaScript阻止他們,因爲這將是非凡的煩人,如果網站能做到這一點。

提示由關閉標籤/瀏覽器窗口離開用戶的唯一方法是使用onbeforeunload事件,並且該事件可以與天然確認對話框中使用,也沒有辦法來使用自定義對話框或者停止使用用戶或者做其他任何事情,因爲這可能會導致某些網站創建系統,您永遠無法離開網站。