具有html5必需属性的tinyMCE textarea的表单无法提交 [英] Form with tinyMCE textarea having html5 required attribute cannot submit

问题描述

这不是问题，而是我想与您分享的答案。我花了四个多小时把头发撕成了TinyMCE或Firefox中的一个错误。

加载TinyMCE后，如果你指定了 textarea 上的HTML5 必需 属性表单将只是不在Firefox中提交。没有错误，Firebug中没有任何错误，只是顽固拒绝提交。

我不知道这是一个FF还是一个TinyMCE错误而且并不在乎。我只是不希望其他程序员经历过我在过去几个小时里所经历的恶化。

提问：是这个bug记录在哪里？有人知道吗？

如果这是Stack Overflow的不合适帖子，请告诉我，我会删除它。

解决方案

问题远非成为Firefox问题。事实上，Chrome和Opera（大脑之前的旧歌剧被移植到了Chrome）并且可能每一个现代浏览器都会给你带来同样的麻烦。

同时拥有Opera和Chrome，有一个标志坚持该字段是必需的，（尽管你有内容）。 Chrome非常适合在控制台中显示此错误消息：

 名称为'< name of name的无效表单控件textarea>'无法集中精力。 
  

当你认为TinyMCE实际上创建了一个可编辑的 div时，并不太令人惊讶容器，隐藏原始 textarea 。这是隐藏的 textarea （带有必需属性）浏览器期望您为其提供值。 / p>

在Github，在这里： https：/ /github.com/tinymce/tinymce/issues/2584 ，有一个建议的解决方案，如下所示：

  //修复tinymce bug 
 if（$ this.is（'[required]'））{
 options.oninit = function（editor）{
 $ this.closest（'form' ）.bind（'submit，invalid'，function（）{
 editor.save（）; 
}）; 
} 
} 
  

我没有亲自测试过这个片段，但是学习它可能会让你前进，只要你能把它放到正确的地方。

This is not a question, but an answer which I want to share with you. I've just spent over four hours tearing my hair out on something which turns out to be a bug in either TinyMCE or Firefox.

With TinyMCE loaded, if you specify the HTML5 required attribute on a textarea the form will just not submit in Firefox. No errors, nothing in Firebug, just a stubborn refusal to submit.

I don't know if this is a FF or a TinyMCE bug and don't really care. I just don't want other coders to go through the aggravation I've gone through these last hours.

To ask a question: Is this bug documented anywhere? Does anyone know?

If this is an inappropriate post for Stack Overflow, tell me and I'll delete it.

解决方案

The problem is far from being a Firefox issue. Indeed Chrome and Opera ("old" opera before the "brain" was transplanted with Chrome's) and probably every other modern browser would give you the same headache.

With both Opera and Chrome, there's a flag insisting the field is a required one, (despite the fact that you have content in it). Chrome is nice enough to give you this error message in the console:

An invalid form control with name='<name of textarea>' is not focusable.

Not too surprising when you consider that TinyMCE actually creates an editable div container, hiding your original textarea. It is this hidden textarea (bearing a required attribute) that the browser is expecting you to provide a value for.

Over at Github, here: https://github.com/tinymce/tinymce/issues/2584, there is a suggested solution which goes like this:

// fix tinymce bug
        if($this.is('[required]')){
            options.oninit = function(editor){
                $this.closest('form').bind('submit, invalid', function(){
                    editor.save();
                });
            }
        }

I haven't tested this snippet personally, but studying it might be able to get you going, as long as you're able to drop it into the right place.

这篇关于具有html5必需属性的tinyMCE textarea的表单无法提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！