JavaScript를 사용하여 텍스트 필드와 TinyMCE 필드를 세 번째 필드에 결합하십시오. TinyMCE를 번호 매기기 목록으로 제한

Question

1. 오늘의 날짜 텍스트 필드와 마지막 업데이트 WYSIWYG 필드를 '기존 기록을 대체하지 않음'으로 지정하고 '기록 보관소로 저장'버튼을 클릭하여 전체 프로젝트 기록 WYSIWYG 필드를 확인하십시오.
2. 날짜는 예제와 같이 추가 할 때 마지막 업데이트 상단에 있어야하며 굵게 표시해야합니다.
3. lastUpdate 값이 기록 필드에 복사 된 후 lastUpdate 필드를 지 웁니다.
4. 가능한 경우 번호 매기기 목록 만 입력 할 수 있도록 각 WYSIWYG 필드를 설정 하시겠습니까? 내가 무엇을 찾고 있어요 수 및 세부이었고, 아래의 바이올린 내에서 예를 제공 한

나는 등 많은 일을하려고 노력했다.

http://fiddle.jshell.net/4n3Cr/22/

는

<p><strong>Today's Date</strong></p> 
<input type="text" name="todaysDate" id="todaysDate" class="todaysDate" /> 

<p><strong>Last Update</strong></p> 

<textarea name="lastUpdate" id="lastUpdate"> 
    <ol> 
    <li>The lastest update on my project. If possible, can we constrain the WYSIWYG editors to only allow numbered lists?</li> 
    </ol> 
</textarea> 

<br> 

<button id="move" value="test" type="button">Copy date and move Last Update text to the History WYSIWYG below</button> 

<p><strong>Complete Project History Below</strong></p> 
<textarea id="history"> 
    <strong>10/16/17</strong> 
    <ol> 
    <li>Some existing content I want to remain.</ol> 
    </li> 
    </ol> 
</textarea> 

<div class="dummy"><strong>DATE</strong></div> 



$(document).ready(function(){ 
    //Initialize Last Update TinyMCE WYSIWYG 
    tinymce.init({ 
    menubar: false, 
    branding: false, 
    selector: "#lastUpdate", 
    plugins: "lists" 
    }); 

    //Initialize history textarea TinyMCE WYSIWYG 
    tinymce.init({ 
    menubar: false, 
    branding: false, 
    selector: "#history", 
    plugins: "lists" 
    }); 

    //Format Today's Date in dd/mm/yyyy format 
    var d = new Date(); 
    var month = d.getMonth()+1; 
    var day = d.getDate(); 
    var output = ((''+month).length<2 ? '0' : '') + month + '/' + 
     ((''+day).length<2 ? '0' : '') + day + '/' + d.getFullYear(); 
    $("#todaysDate").val(output); 

    //I can clear lastUpdate, but need help appending the values to the history WYSIWYG 
    $("#move").click(function() { 
     var lastUpdateEditor = 'lastUpdate'; 
     tinymce.get(lastUpdateEditor).setContent(''); 
    }); 

//Append date and last update to the history field. Right now it is set to on change, but I want button click etc. 
    $(document).on('change', $('input.lastUpdate'), function(){ 
    dummy_html = $('div.dummy').html(); 
    last_update = $('#lastUpdate').html(); 

    editor_content = dummy_html.replace("DATE", $('input.lastUpdate').val()); 
    editor_content = last_update.replace($('input.lastUpdate').val()); 

    tinymce.activeEditor.setContent(editor_content); 
    }); 
}); 

Answer 1

  $(document).ready(function(){ 
      alert('hackhand was of 0$ due to session : your instructor :-) lax'); 
      //Initialize Last Update TinyMCE WYSIWYG 
      tinymce.init({ 
      menubar: false, 
      branding: false, 
      selector: "#lastUpdate", 
      plugins: "lists" 
      }); 

      //Initialize history textarea TinyMCE WYSIWYG 
      tinymce.init({ 
      menubar: false, 
      branding: false, 
      selector: "#history", 
      plugins: "lists" 
      }); 

      //Format Today's Date in dd/mm/yyyy format 
      var d = new Date(); 
      var month = d.getMonth()+1; 
      var day = d.getDate(); 
      var output = ((''+month).length<2 ? '0' : '') + month + '/' + 
      ((''+day).length<2 ? '0' : '') + day + '/' + d.getFullYear(); 
      $("#todaysDate").val(output); 

      //I can clear lastUpdate, but need help appending the values to the history WYSIWYG 
      $("#move").click(function() { 
      var lastUpdateEditor = 'lastUpdate'; 
      //alert(tinymce.get(lastUpdateEditor).getContent()); 
      //tinymce.get(lastUpdateEditor).setContent(''); 
      var historyEditor = 'history'; 
      tinymce.get(historyEditor).setContent(jQuery('#todaysDate').val()+'<br/>'+tinymce.get(lastUpdateEditor).getContent()+'<br />'+tinymce.get(historyEditor).getContent()); 
      tinymce.get(lastUpdateEditor).setContent(''); 
      }); 

      //Append date and last update to the history field. Right now it is set to on change, but I want button click etc. 
      $(document).on('change', $('input.lastUpdate'), function(){ 
      dummy_html = $('div.dummy').html(); 
      last_update = $('#lastUpdate').html(); 

      editor_content = dummy_html.replace("DATE", $('input.lastUpdate').val()); 
      editor_content = last_update.replace($('input.lastUpdate').val()); 

      tinymce.activeEditor.setContent(editor_content); 
      }); 
      });