使用iFrame中可選擇的jQuery

Question

我使用jQuery通過拖拽來開發一個HTML生成器& drop接口。目前，用戶將「塊」元素拖放到覆蓋iFrame的不可見div上（以便它看起來落在iframe上）。當元素被放在這個不可見的div上時，相應的HTML被添加到iFrame主體。

接下來，我想讓用戶能夠選擇iFrame中的元素，並更改所選元素的屬性。

我已將CSS導入和jQuery/jQueryUI腳本附加到iFrame頭中。

我面臨的問題是當單擊附加的iFrame元素時，jQuery選擇套索只在鼠標離開iFrame時出現，並且出現在iframe之外。

我使用iFrame的原因是，當代碼爲用戶「生成」時，我可以將iFrame正文內容附加到對話框。

有沒有人遇到過iFrame和jQuery的問題？有沒有任何文檔/ javaScript庫可以幫助我在這個過程中？

謝謝！

羅裏

Answer 1

「修復」解決此問題是錯綜複雜的，但在我的情況下工作。

我創建的每個加入元件上的單擊事件在iframe像這樣：

$('iframe').contents().find('.elem'+blockVal).on('click', function(){ 
    $('iframe').contents().find('.selected').removeClass('selected'); 
    $(this).addClass('selected'); 
//alert('you have selected the block with class element'+ blockVal); 
}); 

blockVal不同於附加的HTML到的IFRAME功能通過在變量中。上面的函數只是將一個點擊監聽器添加到附加到iframe的每個元素。當任何元素被點擊時，他們被賦予一個「選定」的類別，而任何其他已經擁有該類別的元素都將失去它。

對不起，如果這沒有任何意義。

我給任何人做類似的建議：不要使用iframe。