0

私はこの単純なコードを持っています：

 <div style="margin-left:10px;">
    <p>
     <a class="btn" href="#" onclick="myFunction()"><i class="icon-link"></i></a>
    </p>
  </div>

  <div style="margin-left:10px;">

    <div id="example-one" >
      <p id="textEditor" contenteditable="true"></p>
    </div> 

  </div>



 <script type="text/javascript">



function myFunction()
{

  // removes <div> from #textEdtor's content
  $("#textEditor>div").replaceWith(function() { return $(this).contents(); }); 

  var str=document.getElementById("textEditor").innerHTML; 

  var n=str.replace(/\n|\r/g, '<br>')

  document.getElementById("textEditor").innerHTML=n;

  alert(n);
}

</script>

問題は、var n=str.replace(/\n|\r/g, '<br>')ユーザーがEnterキーを押したときにが機能しないことです。これを使えばとてもうまくいきますが.replace(/\[b\]/g,'<b>').replace(/\[\/b\]/g,'</b>')

<br>Enterキーを2回押した場合にのみ追加されます。

この問題を解決する方法はありますか？

ありがとうございました。

4

1 に答える 1

1

問題は、子<div>要素を削除することです。コードを以下のコードに置き換えると、すべてが正常に機能するはずです。

function myFunction() {
    $("#textEditor > div").before("<br />").contents().unwrap();
}

デモ：http： //jsfiddle.net/Hm7DY/

于 2013-02-13T15:46:51.800 に答える