4 回答

TA貢獻(xiàn)1864條經(jīng)驗(yàn) 獲得超6個(gè)贊
它是打開 jQuery 用戶界面對(duì)話框的標(biāo)題欄不可能嗎?謝謝! 解決方法 1: 我認(rèn)為最好的辦法是使用選項(xiàng) dialogClass。Jquery UI 文檔的摘錄:在初始化:$('.selector').dialog({ dialogClass: 'alert' });或者,如果您要初始化后。: $('.selector').dialog('option', 'dialogClass', 'alert'); 所以我用 dialogClass 選項(xiàng)創(chuàng)建一些對(duì)話框的 = 'noTitleStuff' 和 css 像這樣:.noTitleStuff .ui-dialog-titlebar {display:none} 太簡(jiǎn)單了!但我想為什么我以前的 id-> 鉆井方法的類不工作的 1 天。事實(shí)上調(diào)用.dialog() 方法時(shí)您轉(zhuǎn)換的 div 成為兒童的另一個(gè) div (的真正對(duì)話框的 div) 和可能是 '兄弟' 的標(biāo)題欄 div 中,所以很難找后者起前。 解決方法 2: 我相信,你便可以將其隱藏,用 css:.ui-dialog-titlebar { display:none; } 或者,具體到某個(gè)特定的項(xiàng):div#example .ui-dialog-titlebar { display:none; } 簽出"主題"對(duì)話框。我不相信有不呈現(xiàn)的標(biāo)題欄不幸的是,一個(gè)對(duì)話框選項(xiàng)。 解決方法 3: 我想出動(dòng)態(tài)刪除標(biāo)題欄的修補(bǔ)程序。$("#example").dialog(dialogOpts); // remove the title bar $(".ui-dialog-titlebar").hide(); 呈現(xiàn)對(duì)話框后,這將刪除所有元素與類 ' ui-對(duì)話框的標(biāo)題欄。 解決方法 4: 嘗試此操作$"(# ui-dialog-title-divid").parent().hide() ;按相應(yīng)的 id 替換"得思" 解決方法 5: 我在我的項(xiàng)目中使用該$("#myDialog").dialog(dialogOpts); // remove the title bar $("#myDialog").siblings('div.ui-dialog-titlebar').remove(); // one liner $("#myDialog").dialog(dialogOpts).siblings('.ui-dialog-titlebar').remove() 解決方法 6: 若要隱藏標(biāo)題欄后初始化對(duì)話框時(shí)使用 dialogClass,可以使用 jquery。在初始化:$('.selector).dialog ({ dialogClass: 'yourclassname' });$('.yourclassname div.ui-dialog-titlebar').hide() ;通過使用此方法,您不需要更改您的 css 文件,和這也是動(dòng)態(tài)的。 解決方法 7: 其實(shí)還有另一種方法做這件事,使用該對(duì)話框 '構(gòu)件' 直接:因此你可以在對(duì)話框構(gòu)件$"(# example").dialog(dialogOpts) ;$dlgWidget = $('# example').dialog('widget') ;然后執(zhí)行$ dlgWidget.find(".ui-dialog-titlebar").hide() ;若要隱藏該對(duì)話框僅在標(biāo)題欄在一行代碼 (我喜歡鏈接):$('# example').dialog('widget').find(".ui-dialog-titlebar").hide() ;無需額外的類添加到對(duì)話框的這種方式,只是去看它直接。Workss 對(duì)我來說太好。 解決方法 8: 這工作對(duì)我來說 ……
$("#dialog").dialog ({
創(chuàng)建: {功能用戶界面事件)
}, 解決方法 9: 我發(fā)現(xiàn)時(shí)隱藏對(duì)話框的標(biāo)題欄的一件事,即使顯示為無,屏幕閱讀器仍把它撿起來,將讀取它。如果您已經(jīng)添加您自己的標(biāo)題欄,它將讀取都造成混亂。我做的事刪除它從 DOM 使用 $(selector).remove()?,F(xiàn)在屏幕閱讀器 (和其他人一樣) 不會(huì)看到它因?yàn)樗辉俅嬖凇?解決方法 10: 嗯,沒有一個(gè)答案解決它首先呈現(xiàn)到頁的多余標(biāo)記的事實(shí)。也許真正的答案是不同的插件或重寫。

TA貢獻(xiàn)1868條經(jīng)驗(yàn) 獲得超4個(gè)贊
$('.popBtn').click(function(){
var popMain='內(nèi)容內(nèi)容內(nèi)容內(nèi)容';
Pop(popMain);
});
function Pop(popMain){
var html='';
html +='<div class="pop-div">'+popMain+'</div>';
}

TA貢獻(xiàn)1712條經(jīng)驗(yàn) 獲得超3個(gè)贊
準(zhǔn)備 jQuery 環(huán)境
首先,我們創(chuàng)建一個(gè)按鈕,點(diǎn)擊這個(gè)按鈕的時(shí)候,將會(huì)彈出一個(gè)對(duì)話框。
<input type="button" value="刪除" id="btn" />
為了設(shè)置這個(gè)按鈕點(diǎn)擊的事件,需要準(zhǔn)備 jQuery 的環(huán)境。
<script type="text/javascript" src="scripts/jquery-1.4.2.js"></script>
在 ready 中設(shè)置按鈕的點(diǎn)擊事件。
復(fù)制代碼代碼如下:
$(function() {
// 初始化
$("#btn").click(function() {
alert("btn 被點(diǎn)擊啦!");
}
);
確認(rèn)這一步?jīng)]有問題。
準(zhǔn)備對(duì)話框
第二步,需要準(zhǔn)備對(duì)話框的內(nèi)容。這些內(nèi)容來自 jQuery UI 的演示文件。
復(fù)制代碼代碼如下:
<div id="dialog-confirm" title="Empty the recycle bin?" >
<p>
<span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>
These items will be permanently deleted and cannot be recovered. Are you sure?</p>
</div>
為了使用 jQuery UI 的對(duì)話框,需要增加這些文件的引用。
<script type="text/javascript" src="scripts/jquery.ui.core.js"></script>
<script type="text/javascript" src="scripts/jquery.ui.widget.js"></script>
<script type="text/javascript" src="scripts/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="scripts/jquery.ui.button.js"></script>
<script type="text/javascript" src="scripts/jquery.ui.draggable.js"></script>
<script type="text/javascript" src="scripts/jquery.ui.position.js"></script>
<script type="text/javascript" src="scripts/jquery.ui.dialog.js"></script>
增加樣式
jQuery UI 中使用了大量的樣式來修飾,需要引用 jQuery UI 的樣式,注意,jquery.ui.all.css 這個(gè)文件引用了大量的其他樣式文件,將 jQuery UI 中 \development-bundle\themes\base 文件夾中的內(nèi)容都復(fù)制過來。
<link type="text/css" href="styles/jquery.ui.all.css" rel="stylesheet" />
在 ready 函數(shù)中,同時(shí)也初始化這個(gè)對(duì)話框。
復(fù)制代碼代碼如下:
$(function() {
// 初始化
$("#btn").click(function() {
alert("btn 被點(diǎn)擊啦!");
});
// 初始化對(duì)話框
$("#dialog-confirm").dialog();
});
現(xiàn)在,打開這個(gè)頁面的時(shí)候,就已經(jīng)可以看到對(duì)話框了。
通過按鈕彈出對(duì)話框
我們希望頁面上初始化的時(shí)候看不到這個(gè)對(duì)話框,在點(diǎn)擊按鈕的時(shí)候再出現(xiàn)。那么需要這幾個(gè)工作。
先給對(duì)話框增加一個(gè)默認(rèn)不顯示的樣式。style="display: none",這樣默認(rèn)就不會(huì)看到這一部分。
復(fù)制代碼代碼如下:
<div id="dialog-confirm" title="Empty the recycle bin?" style="display: none">
<p>
<span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>
These items will be permanently deleted and cannot be recovered. Are you sure?</p>
</div>
然后,在初始化對(duì)話框的時(shí)候,也不顯示,僅僅完成初始化工作。
在初始化對(duì)話框的時(shí)候,傳遞一個(gè)參數(shù) autoOpen: false
復(fù)制代碼代碼如下:
$("#dialog-confirm").dialog(
{
autoOpen: false
}
);
在按鈕的點(diǎn)擊事件中,彈出這個(gè)對(duì)話框。
復(fù)制代碼代碼如下:
$("#btn").click(function() {
// alert("btn 被點(diǎn)擊啦!");
$("#dialog-confirm").dialog("open");
});
如果傳遞 close ,將會(huì)關(guān)閉對(duì)話框。
實(shí)現(xiàn)模式對(duì)話框
在實(shí)際應(yīng)用中,我們經(jīng)常需要實(shí)現(xiàn)模式對(duì)話框,在 Web 中需要增加一個(gè)遮罩層來擋住底層的元素,模擬模式效果,這可以在初始化對(duì)話框的時(shí)候,傳遞一個(gè)參數(shù) modal: true 來實(shí)現(xiàn)。修改之后的初始化代碼成為:
復(fù)制代碼代碼如下:
$("#dialog-confirm").dialog(
{
modal: true, // 創(chuàng)建模式對(duì)話框
autoOpen: false, // 只初始化,不顯示
}
);
增加對(duì)話框的按鈕
可以為對(duì)話框增加任意的按鈕,并自定義按鈕的事件處理。我們先增加兩個(gè)按鈕,一個(gè)確定,一個(gè)取消,并讓他們先關(guān)閉對(duì)話框。
復(fù)制代碼代碼如下:
// 初始化對(duì)話框
$("#dialog-confirm").dialog(
{
modal: true, // 創(chuàng)建模式對(duì)話框
autoOpen: false,
buttons: {
"Ok": function() {
$(this).dialog('close');
},
"Cancel": function() {
$(this).dialog('close');
}
}
});
添加回答
舉報(bào)