ボタンを追加した後にcontenteditableプロパティが機能しない

Question

contenteditabledivを作成して、ユーザーがコメントを付けることができます。私はこれを使用します

これはうまく動作しています。これで今何かを書くことができます。

しかし、私はそれに送信ボタンを追加しよう（contenteditableがプロパティを継承し、それも自動的にボタンに適用WEされているので、私はボタンcontenteditable:falseをしなければならない）

しかし、今、私は中に何かを書き込むことはできませんそれ。

https://jsfiddle.net/amok08yg/1/

助けてください。

Answer 1

は、私はあなたがそのような何かをしたいと思います:)

body{background:gray} 
 
.input_wrapper { 
 
    background: white; 
 
    position: relative; 
 
    width:300px; 
 
    height:auto; 
 
    margin-left:40px; 
 
    margin-top:50px; 
 
    margin-bottom:30px; 
 
    padding: 12px 6px 6px; 
 
    box-sizing: border-box; 
 
    display: inline-block; 
 
} 
 
#uploadcomment { 
 
    padding: 0; 
 
    border: none; 
 
    border-bottom:1px solid lightgray; 
 
    font-size:1.1em; 
 
    width: calc(100% - 6px); 
 
    height: 100px; 
 
    max-width: calc(100% - 6px); 
 
    float: right; 
 
    } 
 
#uploadcomment:active, #uploadcomment:focus { 
 
    outline: none; 
 
} 
 
#submitcomment { 
 
    background: transparent; 
 
    border: none; 
 
    margin-top: 6px; 
 
    float: right; 
 
    line-height: 160%; 
 
    }

<div class="input_wrapper"> 
 
    <textarea id="uploadcomment" placeholder="Describe yourself here..."></textarea> 
 
    <button id="submitcomment"contenteditable="false">SUBMIT</button> 
 
</div>