2013-04-05 48 views
2

我使用qtip2用于显示警报消息我的web应用程序(如http://craigsworks.com/projects/qtip2/demos/#dialogues所示)如何给默认的警报功能的行为qtip 2警报

我的代码是

1)对话

function dialogue(content, title) { 
    /* 
    * Since the dialogue isn't really a tooltip as such, we'll use a dummy 
    * out-of-DOM element as our target instead of an actual element like document.body 
    */ 
    $('<div />').qtip(
       { 
        content: { 
         text: content 
         , title: { 
          text: 'PMGSY ', 
          button: 'Close' 
         } 
        }, 
        position: { 
         my: 'center', at: 'center', // Center it... 
         target: $(window) // ... in the window 
        }, 
        show: { 
         ready: true, // Show it straight away 
         modal: { 
          on: true, // Make it modal (darken the rest of the page)... 
          blur: false, // ... but don't close the tooltip when clicked 
          escape: false 
         } 
        }, 
        hide: false, // We'll hide it maunally so disable hide events 

        style: { 
         classes: 'qtip-shadow qtip-rounded qtip-dialogue', // Optional shadow... 
         widget: true //themeroller 
        }, 

        events: { 
         // Hide the tooltip when any buttons in the dialogue are clicked 
         render: function (event, api) { 
          $('button', api.elements.content).click(api.hide); 
         }, 
         // Destroy the tooltip once it's hidden as we no longer need it! 
         hide: function (event, api) { api.destroy(); } 
        } 
       }); 
} 

2)调用它作为警报

function Alert(message) { 
    // Content will consist of the message and an ok button 
    var message = $('<p />', { text: message }), 
    ok = $('<button />', { text: 'Ok', 'class': 'full' }); 
    dialogue(message.add(ok), 'Alert!'); 
} 

的问题是当我使用它,它不会阻止进一步的处理,直到用户点击确定按钮(如默认警报功能)。

例如,此警报甚至不显示。

Alert("Customised alerts"); //this doesent show  
window.location.replace("/Home/startPage"); 

如何使我的自定义警报模仿默认警报功能? 请帮助

回答

0

更换

ok = $('<button />', { text: 'Ok', 'class': 'full' }); 

ok = $('<button />', { text: 'Ok', 'class': 'full' }).click(function(){ 
    window.location.replace("/Home/startPage"); 
});