Question

我正在网站上建立一个发布系统，但每当我在我的textareas上包含TinyMCE插件时，我遇到了一个奇怪的问题。我在JavaScript中验证输入是否为空（参见代码打击）。如果没有TinyMCE，它可以正常工作，但是当我包含TinyMCE插件时，这些值不会返回任何内容。

('#form_createblog').bind('submit',function(){
    var titel = $('input[name=titel]').val();
    var categorie = $('select[name=categorie]').val();
    var synopsis = $('textarea[name=synopsis]').val(); // this remains blank when tinymce is included
    var inhoud = $('textarea[name=inhoud]').val(); // this remains blank when tinymce is included

    console.log(titel);
    console.log(categorie);
    console.log(synopsis);  
    console.log(inhoud);

    var proceed = true;
    if (titel==""){
        $('input[name=titel]').css({'border':'2px solid red'});
        proceed = false;
        }
    if (categorie==""){
        $('select[name=categorie]').css({'border':'2px solid red'});
        proceed = false;
        }
    if (synopsis==""){
        $('textarea[name=synopsis]').css({'border':'2px solid red'});
        proceed = false;
        }
    if (inhoud==""){
        $('textarea[name=inhoud]').css({'border':'2px solid red'});
        proceed = false;
        }

more code leading up to ajax call ...

TinyMCE文件看起来像这样。

tinyMCE.init({
        mode : "textareas",
        theme : "advanced",
        plugins : "paste,advimage",
        width : "100%",
        height : "200",
        relative_urls : false,
        element_format : "html",
        doctype : '<html>',
        theme_advanced_blockformats : "p,h1,h2",
        theme_advanced_buttons1 : "formatselect,bold,italic,|,justifyleft,justifycenter,justifyright,|,bullist,numlist,|,link,unlink,cleanup,|,cut,copy,paste,pastetext,|,image,hr,removeformat",
        theme_advanced_buttons2 : "",
        theme_advanced_buttons3 : "",
        theme_advanced_toolbar_location : "top",
        theme_advanced_toolbar_align : "left",
        theme_advanced_statusbar_location : "bottom",
        theme_advanced_resizing : false,
        theme_advanced_resize_horizontal : false,
        theme_advanced_resizing_use_cookie : false,
        inline_styles : true
});

我的html看起来像这样

<form name="maakblogpost" id="form_createblog" method="post" onsubmit="return false;">

...................................

    <div class="row">
        <div class="col-md-4">
            <span class="titel">Samenvatting van de blogpost</span> 
        </div>   
        <div class="col-md-7">
            <textarea name="synopsis" value=""></textarea>
        </div>
    </div>     

    <div class="row">
    <div class="col-md-4">
            <span class="titel">De daadwerkelijke inhoud van de blogpost</span> 
        </div>   
        <div class="col-md-7">
            <textarea name="inhoud" value=""></textarea>
        </div>
    </div>
    <button class="submit button" name="maakblogpost" type="submit" id="left_btn">Sla uw blog op</button>    
</form>

我怀疑它在我自己的代码中是一个错误，但只是为了安全起见我在这里发布，因为当我没有包含TinyMCE时验证工作正常。

这是tinymce版本3.5.7顺便说一句，这与它有关吗？有人知道它是否也出现在新版本上（我认为它们目前只有4件事）

Answer 1

在提交表单之前，TinyMCE不会设置textarea值，因此您需要在获取值之前手动调用tinyMCE.triggerSave();。

TinyMCE Javascript验证

1 个答案: