保持對話框div放在哪裏

有沒有什麼辦法讓jQuery [UI]在原地生成dialog？或者輕鬆將其移回並使其工作？保持對話框div放在哪裏

YUI2's Panel給了你這樣做的自由，它假定你知道你在做什麼，並把標記放在你放置它的地方。
但現在我已經轉向使用更簡單的jQuery，我注意到了一個限制; jQuery UI似乎只能在body下直接創建對話框。

考慮this example;
假設您想使用div作爲命名空間CSS的一種方式。
通過在.className前加上所有選擇器，並寫入與class="className"分隔的標記，寫入與功能相關的樣式表。

Some 

<div class="sectiona"> 
    <div class="popup" title="A popup"> 
     This text should be <span class="emphasis">blue</span> 
    </div> 
</div> 

irrelevant 

<div class="sectionb"> 
    <div class="popup" title="B popup"> 
     This text should be <span class="emphasis">red</span> 
    </div> 
</div> 

content 

<script>$(function() { $('.popup').dialog(); });</script>

.emphasis { 
    color : yellow; 
} 

.sectiona .emphasis { 
    color : blue; 
} 

.sectionb .emphasis { 
    color : red; 
}

彈出的div（.popup）將被移動到身體，失去所有的CSS！（在現實生活中顯然會更復雜）。由於所有的對話框/面板都是絕對定位的，我希望它們保存的div具有靜態位置，並且是身體的兒童，它wouldn't make any difference at all to keep them there。

不要把這個CSS命名空間技術（如果這是正確的，甚至措辭）作爲本想唯一的原因，我敢肯定還有其他的用例

來源

2013-09-24 Hashbrown

所以這個問題的短版本是：**「jQuery用戶界面從其初始位置移動對話框元素到'身體'，使它成爲一個直接的孩子。有沒有辦法阻止它做到這一點？「**這是正確的嗎？ –

或者在它犯了這個錯誤之後將它移回去，這就是第一條線在接下來要擴展的時候要做的事，如果有一面我可以通過到'dialog（）'，太棒了，否則一個不會破壞事物的解決方法就可以使用了。 – Hashbrown

@ Hashbrown：你會發現人們更感興趣的是幫助那些沒有咆哮的人，不要再稱它爲「大錯特錯「等等，並記住jQuery和jQuery UI **爲你節省了多少時間**所以他們做了一個你不同意的選擇（我也是這樣），不需要繼續下去 –

有一個appendTo選項，你會需要指定它爲每個單獨的彈出窗口：

// HTML 
// added a common "section" class to your divs 
Some 
<div class="section sectiona"> 
    <div class="popup" title="A popup">This text should be <span class="emphasis">blue</span> 
    </div> 
</div> 
irrelevant 
<div class="section sectionb"> 
    <div class="popup" title="B popup">This text should be <span class="emphasis">red</span> 
    </div> 
</div> 
content 

// javascript 
$('.section').each(function() { 
    $(this).find('.popup').dialog({ 
     appendTo: this 
    }); 
});

fiddle

來源

2013-09-24 08:47:46 LeGEC

這是一個[較新的功能]（http://jsfiddle.net/47Se3/1/） jQuery的？因爲API說appendTo選項[是選擇器]（http://api.jqueryui.com/dialog/#option-appendTo），而不是元素 – Hashbrown

你是對的：http://jqueryui.com/upgrade-指南/1.10 /。我只是檢查了文檔，看看是否有一個選項，沒有檢查它何時出現。你能升級到jquery-ui> = 1.10嗎？ – LeGEC

升級將比黑客入侵事件給'appendTo''''選擇器更好。趕上額外的英里。 jQuery應該更新文檔，不是？ – Hashbrown

保持對話框div放在哪裏

回答

相關問題