代码之家 › 专栏 › 技术社区 › Marijn Huizendveld

Wymeditor不会将内容反映到文本区域值中

wymeditor jquery javascript

Marijn Huizendveld · 技术社区 · 7 年前

我开始在一个站点的所有内容类型中部署wymeditor,它看起来不错。现在我要看看它是如何保存和查看的,但它没有提交任何东西,我不知道为什么。

我从几个角度看了这个问题。在这一点上,我甚至会使用monkeypatch,如果我能学会如何自己获取数据,我可以在提交时将其粘贴到字段中。这或是它本身不起作用的真正原因将是伟大的。有人有主意吗?

<li><label for="id_comment">comment on this article:</label> <textarea id="id_comment" rows="10" cols="40" name="comment"></textarea> 
<script type="text/javascript"> 
    $(document).ready(function(){

    jQuery("#id_comment").wymeditor({
      "toolsItems":[
         {
            "name":"Bold",
            "css":"wym_tools_strong",
            "title":"Strong"
         },
         {
            "name":"Italic",
            "css":"wym_tools_emphasis",
            "title":"Emphasis"
         },
         {
            "name":"InsertOrderedList",
            "css":"wym_tools_ordered_list",
            "title":"Ordered_List"
         },
         {
            "name":"InsertUnorderedList",
            "css":"wym_tools_unordered_list",
            "title":"Unordered_List"
         },
         {
            "name":"Indent",
            "css":"wym_tools_indent",
            "title":"Indent"
         },
         {
            "name":"Outdent",
            "css":"wym_tools_outdent",
            "title":"Outdent"
         },
         {
            "name":"Undo",
            "css":"wym_tools_undo",
            "title":"Undo"
         },
         {
            "name":"Redo",
            "css":"wym_tools_redo",
            "title":"Redo"
         },
         {
            "name":"CreateLink",
            "css":"wym_tools_link",
            "title":"Link"
         },
         {
            "name":"Unlink",
            "css":"wym_tools_unlink",
            "title":"Unlink"
         },
         {
            "name":"Paste",
            "css":"wym_tools_paste",
            "title":"Paste_From_Word"
         }
      ],
      "logoHtml":"",
      "updateEvent":"blur",
      "stylesheet":"/static/yui/tiny_mce.css",
      "skin":"twopanels",
      "classesHtml":"",
      "updateSelector":"textarea"
      });

    });
</script></li>

3 回复 | 直到 15 年前

2 revs<br/>cefn 17 年前

我也遇到了同样的问题,从他们网站提供的wymexamples目录中的示例1可以看出,wymeditor使用特殊元素类(css类)来指示页面中需要添加额外行为的部分。

特别是,submit按钮有一个wymupdate类,我认为这会导致一个预提交处理程序与控件关联。

一旦我将wymupdate类添加到源代码中的submit按钮中,那么在提交之前,textarea字段用html填充,它在正确的post变量中显示在服务器端。

我包括下面的相关位,从示例源,使其工作…

<script type="text/javascript">
jQuery(function() {
    jQuery('.wymeditor').wymeditor();
});
</script>

…

<form method="post" action="">
<textarea class="wymeditor">&lt;p&gt;Hello, World!&lt;/p&gt;</textarea>
<input type="submit" class="wymupdate" />
</form>

…尽管wymupdate类关联似乎是automagic,但wymeditor类关联是显式触发的,如 <script> ,然后它必须查找wymupdate类的内容。

aky 13 年前

而不是这个:

"updateEvent":"blur",
"updateSelector":"textarea"

你需要:

"updateEvent":"click",    
"updateSelector":"[type=submit]"

Timo Huovinen 14 年前

您还可以强制更新所有的wymeditor,这是我在实际提交之前需要做的,因为我有定制的功能来操作textarea内容。

document.addEventListener('submit',function(e){
    e.preventDefault();
    //update all the wymeditors
    var i=0,wym = jQuery.wymeditors(i);
    while(wym){
        i++;
        wym._element.html(wym.xhtml());
        //wym.update();//would use this, but it is not reliable
        wym = jQuery.wymeditors(i);
    }
    e.target.submit();
});