bootstrap中使用modal加載kindeditor時彈出層文本框不能輸入怎么辦

這篇文章主要為大家展示了“bootstrap中使用modal加載kindeditor時彈出層文本框不能輸入怎么辦”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“bootstrap中使用modal加載kindeditor時彈出層文本框不能輸入怎么辦”這篇文章吧。

具體代碼如下所示：

$('#myModal').on('shown', function() {
 $(document).off('focusin.modal');
});
//顯示modal
$('#myModal').modal('show');
//show完畢前執行
$('#myModal').on('shown', function () {
  //加上下面這句！解決了~
  $(document).off('focusin.modal');
 // 打開Dialog后創建編輯器
 KindEditor.create('textarea[name="content"]', {
  resizeType : 1
 });
})
//hide完畢前執行
$('#myModal').on('hidden', function () {
 // 關閉Dialog前移除編輯器
 KindEditor.remove('textarea[name="content"]');
})

下面是我在項目中的應用，請大家注意加注釋的那一句！

function computeMaskHeight() {
   var obj = $("#blockLoading");
   var parent = obj.parent();
   obj.height(parent.height());
  }
  function block(opt) {
   var defaults = {
    title: "",
    showClose: true,
    showOk: true,
    showBottom: true,
    showTitle: true,
    showHead: true,
    onOk: function() {
    },
    onShown: function(e) {
    }
   };
   var setting = $.extend(defaults, opt);
   $("#blockTitle").html(setting.title);
   if (setting.showClose) {
    $("#closeBlock, #closeBlockX").show();
   } else {
    $("#closeBlock, #closeBlockX").hide();
   }
   if (setting.showOk) {
    $("#blockOk").show();
   } else {
    $("#blockOk").hide();
   }
   $("#blockOk").unbind().click(function() {
    setting.onOk();
   });
   if (setting.showBottom) {
    $("#blockBottom").show();
   } else {
    $("#blockBottom").hide();
   }
   if (setting.showHead) {
    $("#blockHead").show();
   } else {
    $("#blockHead").hide();
   }
   $("#blockBody").html("<i class='icon-spinner icon-spin icon-4x'></i>");
   $('#blockContainer').off('shown.bs.modal').on('shown.bs.modal', function (e) {
    $(document).off('focusin.modal');//解決編輯器彈出層文本框不能輸入的問題http://stackoverflow.com/questions/14795035/twitter-bootstrap-modal-blocks-text-input-field
    setting.onShown(e);
   });
   $("#blockContainer").modal();
  }

以上是“bootstrap中使用modal加載kindeditor時彈出層文本框不能輸入怎么辦”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！