2015-10-15 53 views
0

如何實現觸發文檔元素的點擊事件的事件功能。針對文檔的iframe元素觸發事件事件的操作

我必須採取document.getElementById("iframe-id").contentWindow.window.document.getElementById("hello-abc")的行動。

是否有可能實現使用Backbone.View()?

<!-- Sample example --> 
 
<html> 
 
<head></head> 
 
<!-- parent #document --> 
 
<body> 
 
    <div class="height-inherit"> 
 
    <div id="pdf-overlay" class="modal fade in" data-replace="true" aria-hidden="false" data-keyboard="false" style="overflow-y: hidden !important; display: block;"> 
 
     <div class="modal-dialog"> 
 
     <div class="modal-body"> 
 

 
       <!-- this id =pdf could access from parent document--> 
 
       <iframe id="pdf" width="100%" scrolling="no" tabindex="0" vspace="0" class="" allowtransparency="true" aria-hidden="true" frameborder="0" hspace="0" marginheight="0" marginwidth="0" height="621" src="/static/lib/pdfjs/web/viewer.html?file=/static/app/abc.pdf"> 
 
        <!-- child #document --> 
 
       <html> 
 
        <head></head> 
 
        <body> 
 
        <div> 
 
        <!-- I have to impelemt in parent view(.js) on listen from child window document element tiggered event --> 
 
        <button id="hello-abc" data-l10n-id="error_close" style="margin-top:5px;">Close</button> 
 

 
        </div> 
 
        </body>     
 
       </html> 
 
       </iframe> 
 
       
 
     </div> 
 
    </div> 
 
    </div> 
 
    </div> 
 
</body> 
 
</html>

回答

0

您可以將您的視圖的el到I幀body並定義事件它的元素就像任何其他骨幹視圖。

如有必要,您可以讓其他視圖(如父視圖)從iframe視圖中偵聽事件。

喜歡的東西:

var TestView = Backbone.View.extend({ 
el: $('iframe').get(0).contentWindow.document.body, 
initialize: function() { 
    this.render(); 
}, 
events: { 
    'click button': 'eventHandler' 
}, 
render: function() { 
    this.$el.append($('#iframe-template').html()); 
}, 
eventHandler: function(e, rivetsView) { 
    alert('bingo!'); 
    //triger a custom event for the parent view or such if required 
} 
}); 
var test = new TestView();