javascript関数summernoteにテキストを挿入する

したがって、通常のjavascript関数内でsummernoteにテキストを挿入しようとしています。クリックすると実際のテキストエリアに自分自身を追加する必要がある値のリストがあります。私はクリックするとコンソールにメッセージが記録されるが何らかの理由で何も追加されていないので、関数は起動している。ここでは関数である：。javascript関数summernoteにテキストを挿入する

すべてが第7行、$（ "summernote"）summernote（ 'コード'、ID）を除いて取り組んでいる

function appendListItem(ele){ 
    console.log("Clicked!"); 
    var id = $(ele).attr("id"); 
    console.log(typeof(id)); 
    console.log("ID:" + id); 
    //var htmlStr = "<p>#"+id+"</p>"; 
    $(".summernote").summernote('code', id); 
    console.log($("#summernote").summernote('code')); 
}

;.私はsummernote関数でも 'insertText'を使ってみました。 idは文字列です。そして、私は、コメントアウトされた行（行6）によって証明されるように、html文字列を渡そうとしました。あなたが私に与えることができるどんな助けも大いに感謝されるでしょう！

EDIT 1：要求されたとして

ここでは私のhtmlです：

<body> 
    <div><img src="./images/Logo.png" alt="Logo" class="logo-center"></div> 
    <div id="summernote"></div> 
    <div class="checkList"> 
     <p id="checkTitle">CHECKLIST (<span id="fraction">0/5</span>)</p> 
     <ul class="list-group" id="trigList"> 
      <li class='list-group-item'><a id='mood' onclick='appendListItem(this)'>Mood</a></li> 
      <li class='list-group-item'><a id='phone' onclick='appendListItem(this)'>Phone</a></li> 
      <li class='list-group-item'><a id='email' onclick='appendListItem(this)'>Email</a></li> 
      <li class='list-group-item'><a id='lead' onclick='appendListItem(this)'>Lead</a></li> 
     </ul> 
    </div> 
    <div><button type="button" class="btn btn-primary" onclick="logNote();">Log Note</button></div> 
</body>

出典

2017-11-15 Karsten Andersen

のですか？ –

@AndrewLohrちょうど –

あなたが混ざっjQueryのセレクタを持っているように見えます。原因で.セレクタにsummernoteのクラスを持つすべての要素を取得するためのjQueryを語っている - あなたは現在このライン$(".summernote").summernote('code', id);を使用して、何をしているかid="summernote"

をそのIDを使用してアクセスできるように、1 Summernoteを持っています始まり。

あなたのhtmlの要素にはクラスのsummernoteがありませんので、その理由は機能しません。

$(".summernote").summernote('code', id);から$("#summernote").summernote('code', id);に変更する必要があります。 #は実際のSummernote要素であるid="summernote"の要素を取得します。ここで

はあなたのhtmlがあまりにも表示することができ、完全な作業例

<body> 
    <div><img src="./images/Logo.png" alt="Logo" class="logo-center"></div> 
    <div id="summernote"></div> 
    <div class="checkList"> 
     <p id="checkTitle">CHECKLIST (<span id="fraction">0/5</span>)</p> 
     <ul class="list-group" id="trigList"> 
      <li class='list-group-item'><a id='mood' onclick='appendListItem(this)'>Mood</a></li> 
      <li class='list-group-item'><a id='phone' onclick='appendListItem(this)'>Phone</a></li> 
      <li class='list-group-item'><a id='email' onclick='appendListItem(this)'>Email</a></li> 
      <li class='list-group-item'><a id='lead' onclick='appendListItem(this)'>Lead</a></li> 
     </ul> 
    </div> 
    <div><button type="button" class="btn btn-primary" onclick="logNote();">Log Note</button></div> 
    <script> 
    $(document).ready(function() { 
     $('#summernote').summernote(); 
    }); 
    function appendListItem(elem) { 
     //var htmlStr = "<p>#"+id+"</p>"; 
     var id = $(elem).attr("id"); 
     console.log(id); 
     $("#summernote").summernote('code', id); 
     // use 'insertText' instead of 'code' to append the id instead 
    } 
    </script> 
</body>

出典

2017-11-16 14:18:06

素晴らしい、ありがとう！私のところでばかげたミス。 –

javascript関数summernoteにテキストを挿入する

答えて

関連する問題