2017-11-15 20 views
0

그래서 일반 자바 스크립트 함수 내에서 summernote에 텍스트를 삽입하려고했습니다. 클릭했을 때 실제 텍스트 영역에 자신을 추가해야하는 값 목록이 있습니다. 클릭 할 때 콘솔에 로그되는 메시지가 있기 때문에 기능이 실행되고 있습니다. 그러나 어떤 이유로 든 계속 추가되지 않습니다. 여기에 기능은 다음과 같습니다.자바 스크립트 함수 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는 문자열입니다. 그리고 주석 된 행 (Line 6)에 의해 입증 된 것처럼 html 문자열을 전달하려고했습니다. 당신이 내게 줄 수있는 도움은 크게 감사하겠습니다!

편집 1 :

여기의 요청에 따라 내 HTML이다 : 당신의 jQuery 셀렉터가 혼합이 같은

<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> 
+0

입니까? –

+0

@AndrewLohr 그냥 않았다 –

답변

1

것 같습니다. 당신의 ID를 사용하여 액세스 할 수 있도록 1 Summernote이 id="summernote"

당신이 현재이 라인 $(".summernote").summernote('code', id);을 사용하고있는 -으로 인해 . 선택기에 클래스 summernote이 모든 요소를 ​​얻기 위해 jQuery를 말하고있다 처음.

의 요소가 없으므로 그 요소가 작동하지 않습니다.

$(".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> 
+0

굉장, 고마워! 내 부분에 어리석은 실수 .. –