วิธีเปิดใช้งาน TinyMCE หลายรายการในรูปแบบเดียวกัน

ฉันต้องการใช้ textarea 2 อันที่แตกต่างกันกับ TinyMCE ในรูปแบบเดียวกัน อันแรกทำงานได้ดี แต่เมื่อใดก็ตามที่ฉันเพิ่มอันที่ 2 อันที่ 2 จะปิดใช้งาน (มันจะเปิดใช้งานเมื่อฉันขยายด้วยตนเองจากมุมขวาล่าง) ชื่อฟิลด์และรหัสแตกต่างกันป้อนคำอธิบายรูปภาพที่นี่

ใครสามารถบอกฉันว่าฉันจะแก้ไขปัญหานี้ได้อย่างไร

ขอบคุณล่วงหน้า.


person Anjuman    schedule 20.03.2012    source แหล่งที่มา
comment
โปรดโพสต์การกำหนดค่า Tinymce แบบเต็มของคุณ   -  person Thariama    schedule 20.03.2012


คำตอบ (3)


เนื่องจากไม่มีรหัสจากคุณ เราจึงไม่สามารถทราบได้ว่าปัญหาของคุณอยู่ที่ใด อาจจะไปทางอื่น เริ่มต้น TinyMce สำหรับ Textareas ทั้งสองในคลาส:

<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
        mode : "textareas",
        theme : "simple",
        editor_selector : "mceSimple"
});

tinyMCE.init({
        mode : "textareas",
        theme : "advanced",
        editor_selector : "mceAdvanced"
});
</script>

<form method="post" action="somepage">
        <textarea name="content1" class="mceSimple" style="width:100%">
        </textarea>
        <textarea name="content2" class="mceAdvanced" style="width:100%">
        </textarea>
</form>

ไชโยสเตฟาน

person SG 86    schedule 21.03.2012
comment
ขอบคุณสำหรับคำตอบ. ฉันต้องใช้โปรแกรมแก้ไขธีมเดียวกัน (แบบง่าย) - person Anjuman; 27.03.2012

หากคุณปรับขนาดพื้นที่ของ Tinymce ข้อความจะปรากฏขึ้นอย่างน่าอัศจรรย์

โซลูชันจาวาสคริปต์ของ Mikko Huilaja:

<script type="text/javascript">

$(window).load(function() { 
  forceTinyMceIframeResize(); 
});

function forceTinyMceIframeResize() { 
  $('.mceEditor .mceIframeContainer iframe').each(function(i) { 
    $(this).height($(this).height()+1); 
  }); 
}
</script>
person Protheus    schedule 28.03.2012
comment
ฉันรู้ว่าการคลิกที่มุมขวาล่างของตัวแก้ไขหรือการปรับขนาดจะช่วยแก้ปัญหาได้ แต่ผู้ใช้ไซต์อาจไม่เข้าใจสิ่งนี้ อย่างไรก็ตาม ขอบคุณสำหรับคำตอบของคุณ - person Anjuman; 26.06.2012

ใช้คลาสทั่วไป (เช่น Tinymce-editor) สำหรับพื้นที่ข้อความทั้งหมดที่คุณต้องการเพิ่ม TinyMCE

จากนั้นในส่วนหัว HTML ให้เพิ่มโค้ดต่อไปนี้เพื่อเริ่มต้น TinyMCE

$(function(){
   tinyMCE.init({
    selector: '.tinymce-editor',
    statusbar: false,
    min_height: 120,
    menubar: false,
    toolbar: 'styleselect | bold italic underline | undo redo | image | link',
    plugins: 'image, link',
    forced_root_block: false,
    default_link_target: "_blank",
    link_assume_external_targets: true 
   });
}); 
person Amal Kumar S    schedule 17.04.2017