Question

我正在创建一种类型的内容管理系统，允许用户基于模板创建页面。

我有一个包含2个占位符div的页面。下面是一个示例。当您单击div时，会弹出一个模式，允许用户使用TinyMCE来创建内容。想法是设置内容，单击“获取数据”按钮，使模式消失，编辑器中的内容现在显示在原始div中。

当我点击“提交”时，这可以在div中输入内容。模态的主体此时消失了，但是通常位于引导模态下的灰色不透明屏幕仍然存在，我无法在页面上做任何事情。我想知道我在这里做错了什么，当我点击“提交”按钮时，如何解决它以完全关闭模式。

    <div class="leftContent">
        <div class="modal fade bd-example-modal-lg" id="leftFiftyModal" tabindex="-1" role="dialog" aria-labelledby="leftFiftyLabel" aria-hidden="true">
            <div class="modal-dialog modal-lg" role="document">
              <div class="modal-content">
                <div class="modal-header">
                  <h5 class="modal-title" id="leftFiftyModal">Content Library:</h5>
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                  </button>
                </div>
                <div class="modal-body">
                    <h3>Create your own content</h3>
                    <form id="form-data" method="post">
                      <textarea id="mytextarea"></textarea>
                      <input type="submit" value="Get Data">
                    </form>
                </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <button type="button" class="btn btn-primary">Save changes</button>
                    </div>
               </div>
            </div>
        </div>
    </div>

    <script type="text/javascript">
        $(document).ready(function(){

        $("#form-data").submit(function(e){

            var content = tinymce.get("mytextarea").getContent();

            $(".leftContent").html(content);

            return false;

        });

        jQuery.noConflict();
        $('#leftFiftyModal').modal('hide');

    });
    </script>

Answer 1

尝试：

<script type="text/javascript">
    $(document).ready(function(){

    $("#form-data").submit(function(e){

        var content = tinymce.get("mytextarea").getContent();

        $(".leftContent").html(content);

        jQuery.noConflict();

        $('#leftFiftyModal').modal('hide');

        return false;

    });

});
</script>

从模式提交表单数据，模式不会关闭

1 个答案: