无法在BPopup框中包含Nicedit Rich Text Editor。取向混淆了

时间:2012-07-06 01:38:23

标签: jquery popup textarea nicedit bpopup

我是Jquery的新手,并尝试在我的项目中使用它。

我有一个页面,使用bPopup。在bPopup中,我在弹出div中包含了nicedit。但富文本工具栏似乎搞砸了。任何人都知道如何解决它?

以下是输出的代码和示例。

enter image description here

nicedit的工具栏似乎与方向混在一起。但是当我在普通网页中使用nicedit(没有弹出窗口)时,它可以完美地工作。

的index.php ----

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

    <script type = "text/javascript" src = "http://code.jquery.com/jquery-1.7.2.min.js"></script> <!--This is for the interface-->
    <script type = "text/javascript" src = "http://dinbror.dk/downloads/jquery.bpopup-0.7.0.min.js"></script>
    <script type="text/javascript" src="http://js.nicedit.com/nicEdit-latest.js"></script> 

</head>
<body>

<button>POP IT UP</button>

<div style = "position: relative; display:none; width:500px; height:500px; background-color:white; border-radius: 10px 10px 10px 10px; box-shadow: 0 0 25px 5px #999;">

<textarea id = "area1" name = "area1" cols = "40">
This is the default text in text box.
</textarea>
<script>
bkLib.onDomLoaded(function() {
    new nicEditor().panelInstance('area1');

});
</script>
</div>



<h1 style = "background-color : white">This is the content
   <script>
    // Semicolon (;) to ensure closing of earlier scripting
    // Encapsulation
    // $ is assigned to jQuery
    ;(function($) {
         // DOM Ready
        $(function() {

            // Binding a click event
            // From jQuery v.1.7.0 use .on() instead of .bind()
            $('button').on('click', function(e) {

                // Prevents the default action to be triggered. 
                e.preventDefault();

                // Triggering bPopup when click event is fired
                $('div').bPopup({
                    position: ['auto', 'auto'], //x, y
                    modal: true, //A transperant black layer behind
                    positionStyle: 'fixed', //Fix the popup in the middle
                    scrollbar: false,

                });

            });

        });

    })(jQuery);
    </script>


</body>
</html>

0 个答案:

没有答案