2
我的jquery對話框在Firefox中無法正常工作，但Firebug不會給我任何錯誤。我的對話框在Chrome中運行得很好。firefox中的jquery對話框問題：第一次打開後無法輸入
情況： 我有幾個jQuery對話框在我的網頁上打開不同的事件。一個「添加新元素」對話框給我一個問題。第一次打開對話框時效果很好。隨後的任何時候，文本輸入框都不能被點擊或鍵入。我想我通過每次銷燬對話框來解決問題。然後，每當你打開它時它就會起作用。但後來我發現是否有其他對話框打開，然後這個「添加新元素」對話框打開，同樣的事情再次發生：無法輸入框中。
我很困惑！請任何幫助，將不勝感激...我一直盯着這個代碼幾天了。
這裏是jQuery的對話框代碼：
$(function() {
$("#dialog-new-osc-el").dialog({
resizable: false,
autoOpen: false,
height:300,
width:400,
modal: true,
buttons: {
"Create": function() {
*create button function stuff here* then:
$(this).dialog("destroy");
$(this).dialog("close");
create_new_osc_el_dialog();
},
Cancel: function() {
$(this).dialog("destroy");
$(this).dialog("close");
create_new_osc_el_dialog();
}
},
close: function() {
$(this).dialog("destroy");
$(this).dialog("close");
create_new_osc_el_dialog();
}
});
});
而當打開該對話框中的 「添加新的元素」 被點擊的div上 - 的div有一個onclick功能：
<div class="addnewbox" onclick="addneweltoosc();">
此的onclick函數看起來像這樣（爲了簡潔起見刪除了一些代碼）：
function addneweltoosc(){
$("#dialog-new-osc-el").dialog("open");
}
對話框的實際HTML很長，這裏是重要的東西：
<div id="dialog-new-osc-el" title="Create Element">
<div id="new_osc_el_type" class="pointer">
<ul>
<li onclick="new_osc_el_type_chosen('Branch');">Branch</li>
<li onclick="new_osc_el_type_chosen('Group');">Group</li>
<li onclick="new_osc_el_type_chosen('Division');">Division</li>
<li onclick="new_osc_el_type_chosen('Unit');">Unit</li>
<li onclick="new_osc_el_type_chosen('Strike Team');">Strike Team</li>
<li onclick="new_osc_el_type_chosen('Task Force');">Task Force</li>
<li onclick="new_osc_el_type_chosen('Individual Resource');">Individual Resource</li>
</ul>
</div>
<p><input class="hide" type="text" id="new_osc_el_pos_name" />
</div>
該對話框首先給用戶一個可供選擇的列表。當用戶點擊一個列表項時，調用new_osc_el_type_chosen函數。該功能隱藏該列表並顯示「new_osc_el_pos_name」文本輸入。 這是首次打開對話框時輸入框的輸入框，但不是之後。這是代碼：
function new_osc_el_type_chosen(a)
{
$("#new_osc_el_type").addClass("hide");
$("#new_osc_el_pos_name").removeClass("hide");
if (a=="Branch")
{
$("#new_osc_el_pos_name").val("NAME of Branch Director");
}
document.getElementById("new_osc_el_pos_name").setSelectionRange(0,7);
$("#new_osc_el_pos_name").focus();
}
解決了！
顯然，所有的模態對話框都會導致它們之間的衝突......或者某種東西。其實，我不是100％肯定爲什麼 - 但改變模態：真正的模態：錯誤解決了我的問題。
我有兩次類似的問題，每個都有自己的修復（IIRC）。第一次是當我使用jQuery UI的對話框（我需要使用modal：true），我認爲這個問題與z-index屬性有衝突（我的輸入太低）。第二次是用自制軟件元素，這是因爲我在受影響的輸入上測試了.disableSelection（），並忘記了這一點。 – 2012-09-06 18:25:24
有同樣的問題！很煩人！設置模態：假也適用於我，但我不想陷入困境，所以請在下面查看我的答案，以找到解決方案，爲我解決這個問題，並仍然提供模態行爲。 – nothingisnecessary 2013-04-26 18:08:03