帶有NicEdit問題的Modal JQuery-UI對話框

我有一個帶有NicEdit編輯器的JQuery模型對話框。 NicEditor有一個HTML按鈕，允許用戶直接調整HTML。莫代爾對話之外，這工作正常。但是在模態對話框中它不會保持打開狀態。帶有NicEdit問題的Modal JQuery-UI對話框

我已經在Plunker中複製了這個。 https://plnkr.co/edit/kr6GAS4Z0SNh6Ws38WdO?p=preview

<!DOCTYPE html> 
<html> 

    <head> 
    <link rel="stylesheet" href="style.css"> 
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.js"></script> 
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 
    </head> 

    <body> 
    <div id="dialog" title="test" style="display:none;"> 
    <form> 
     <textarea id="editor"></textarea> 
    </form> 
</div> 
<input type="button" id="test" value="open dialog wysiwyg"/>  
    </body> 
<script> 
    $('#test').click(function(){ 
    $('#dialog').dialog({ 
     width:400, 
     height:400, 
     modal:true, 
     open: function(){ 
      new nicEditor({ minHeight: 220, maxHeight: 220, fullPanel: true, iconsPath:'https://cdn.jsdelivr.net/nicedit/0.9r24/nicEditorIcons.gif'}).panelInstance('editor'); 
     } 
    }); 


}); 

</script> 
</html>

有沒有這個，可向工作什麼辦法？

來源

2017-03-01 Chris Nevill

我認爲問題源於NicEdit未放置編輯窗格中的對話框本身 - 我認爲這是安裝到主體。車削模式解決了問題 - 儘管理想情況下我希望它！ –

懷疑這是一個操作問題的順序。試試這個：

https://plnkr.co/edit/pEFjSYhCem5TFkUeunvt?p=preview

HTML

<head> 
    <meta charset="utf-8" /> 
    <title> 
    <!-- Title here --> 
    </title> 
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" /> 
    <link rel="stylesheet" href="style.css" /> 
    <script src="https://code.jquery.com/jquery-1.6.min.js"></script> 
    <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script> 
    <script src="./nicedit.js"></script> 
</head> 

<body> 
    <textarea id="editor"></textarea> 
    <div id="dialog"> 
    <textarea id="editorInDialog"></textarea> 
    </div> 
    <input type="button" id="test" value="open modal dialog" /> 
    <script> 
    $('#test').click(function() { 
     $("#dialog").dialog("open"); 
    }); 
    $('#dialog').dialog({ 
     autoOpen: false, 
     modal: true, 
     open: function() { 
     new nicEditor({ 
      fullPanel: true, 
      iconsPath: 'https://cdn.jsdelivr.net/nicedit/0.9r24/nicEditorIcons.gif' 
     }).panelInstance('editorInDialog'); 
     } 
    }); 

    new nicEditor({ 
     fullPanel: true, 
     iconsPath: 'https://cdn.jsdelivr.net/nicedit/0.9r24/nicEditorIcons.gif' 
    }).panelInstance('editor'); 
    </script> 
</body>

來源

2017-03-02 20:26:53 Twisty

這似乎表現出同樣的問題。點擊HTML按鈕會導致HTML編輯器打開，但單擊編輯器會導致它再次關閉。 –

所以我懷疑這個特定的問題是堆棧/元素焦點問題。 HTML「對話框」出現在一個可用的空間中，但是當試圖點擊它或者與它交互時，它會自動關閉。我想知道這個'z-index'是否需要高於覆蓋層，比如1003。 – Twisty

它打開時似乎獲得了9999的「z-index」。要做更多的調查。 – Twisty

帶有NicEdit問題的Modal JQuery-UI對話框

回答

相關問題