无法在TinyMCE编辑器中输入空格

我最近遇到了无法在内联TinyMCE可编辑区域中添加空格的问题。无法在TinyMCE编辑器中输入空格

正如您在下面所看到的，单击前3个导航项目时是可编辑的，您可以键入任何字符，但是当您选择“Thislinkcannotcontainspaces”链接时，不能添加任何空格。

它们都使用相同的data-editable最小属性，它们都被挂钩到a标签中，都在li之内，我完全不知道为什么会发生这种情况。

预期的行为是所有导航元素都可以用任何字符（包括空格）进行编辑。

tinymce.init({ 
 
    selector: '[data-editable-minimal]', 
 
    inline: true, 
 
    toolbar: false, 
 
    menubar: false 
 
});

h2.mce-content-body { 
 
    font-size: 200%; 
 
    padding: 0 25px 0 25px; 
 
    margin: 10px 0 10px 0; 
 
} 
 

 
body { 
 
    background: transparent; 
 
} 
 

 
.content { 
 
    overflow: visible; 
 
    position: relative; 
 
    width: auto; 
 
    margin-left: 0; 
 
    min-height: auto; 
 
    padding: inherit; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 
<link href="//www.tinymce.com/css/codepen.min.css" rel="stylesheet" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<script src="//cdn.tinymce.com/4/tinymce.min.js"></script> 
 
<nav class="navbar navbar-default navbar-user"> 
 
    <div class="container"> 
 
    <div class="navbar-header"> 
 

 
     <!-- Collapsed Hamburger --> 
 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#app-navbar-collapse"> 
 
       <span class="sr-only">Toggle Navigation</span> 
 
       <span class="icon-bar"></span> 
 
       <span class="icon-bar"></span> 
 
       <span class="icon-bar"></span> 
 
      </button> 
 
    </div> 
 

 
    <div class="collapse navbar-collapse" id="app-navbar-collapse"> 
 
     <!-- Left Side Of Navbar --> 
 
     <ul class="nav navbar-nav"> 
 
     <li><a href="#" data-editable-minimal>Forums</a></li> 
 
     <li class="dropdown"> 
 
      <a href="#" class="" role="button" aria-haspopup="true" aria-expanded="false" data-editable-minimal>A Link 
 
      <span class="caret"></span></a> 
 
      <ul class="dropdown-menu open show"> 
 
      <li><a href="/" data-editable-minimal>Thislinkcannotcontainspaces</a></li> 
 
      </ul> 
 
     </li> 
 
     <li><a href="/" data-editable-minimal>A link</a></li> 
 
     </ul> 
 
    </div> 
 
    </div> 
 

 
</nav>

来源

2017-04-19 Ian