2013-03-18 50 views
3

我有一個使用jQuery手機的主幹應用。我試圖使用對話框彈出,但是問題是當我點擊鏈接#popupSuccess它不激活模式,因爲我假設骨幹陷害它。有任何想法嗎?jQuery Mobile對話框和主幹js

這是我的模態代碼

<a class="modalLink" id="modalSuccessTrigger" href="#popupSuccess" data-rel="popup" data-position-to="window" data-role="button" data-inline="true" data-transition="pop" data-icon="delete" data-theme="b">Success</a> 

<div data-role="popup" id="popupSuccess" data-overlay-theme="a" data-theme="c" data-dismissible="false" style="max-width:400px;" class="ui-corner-all modalLinkCont"> 
    <div data-role="header" data-theme="a" class="ui-corner-top"> 
     <h1>Correct!</h1> 
    </div> 
    <div data-role="content" data-theme="d" class="ui-corner-bottom ui-content" style="background-color:white"> 
     <h3 class="ui-title">That is correct. Tap to continue to level 2</h3> 
     <a href="#" data-role="button" data-inline="true" data-rel="back" data-transition="flow" data-theme="b">Contineu</a> 
    </div> 
</div> 
+1

請發佈相關JavaScript。 – 2013-03-18 02:10:24

+0

@ScootaP你應該使用視圖事件{{「a click」:「activateModal」}來捕獲鏈接點擊,其中activateModal是處理模式顯示的視圖上的一個方法,如:$(「#modaldiv」)。dialog ()' – Deeptechtons 2013-03-18 09:07:08

+0

根據上面的標記,你打開右邊的'popup'遇到困難? – Omar 2013-03-18 10:12:03

回答

4

您需要以編程方式啓動彈出:

在您的骨幹觀點:

events: { 
    'click #modalSuccessTrigger': 'openPopUp' 
}, 

openPopUp: function(e) { 
    e.preventDefault() 
    $('#modalSuccessTrigger').popup('open') 
} 

瞭解更多詳情請參閱文檔:http://jquerymobile.com/demos/1.2.0-alpha.1/docs/pages/popup/index.html

+0

這是'彈出';) – Omar 2013-03-18 10:09:49

+0

哦,正確 - 天! – neebz 2013-03-18 10:12:53

0

要處理此問題,我使用防止主幹路由並激活彈出式處理標記爲data-rel="popup"

$(document).ready(function(){ 
    ($('a[data-rel="popup"]')).on('click', function(event) { 
    event.preventDefault(); 
    event.stopImmediatePropagation(); 
    var target = $(this).attr("href"); 
    $(target).popup('open'); 
    }); 
});