tinymce 在博客中有双文本框

tinymce has double text box in a blog

我正在通过 django 创建一个博客应用程序。 以上是post的创作形式。并且 Tinymce 工作正常,除了文本框内的文本框。 这可以手动删除,但我希望它不要出现在第一位。 我想删除它,但我不能。我该怎么办?

我有那些模型、表格和 html。

models.py

class BlogPost(models.Model):
    title                   = models.CharField(max_length=50, null=False, blank=False)
    body                    = HTMLField('Content')
    date_published          = models.DateTimeField(auto_now_add=True, verbose_name="date published")
    date_updated            = models.DateTimeField(auto_now=True, verbose_name="date updated")   
    author                  = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)

    #featured                = models.BooleanField()                        
    #categories              = models.ManyToManyField(Category)             

    def __str__(self):
        return self.title

    def get_absolute_url(self):                                           
        return reverse('blog:detail', kwargs={
            'id': self.id,
            'title': self.title
        })

    @property
    def get_comments(self):
        return self.comments.all().order_by('date_updated')

    @property
    def comment_count(self):
        return Comment.objects.filter(blogpost=self).count()

    @property
    def view_count(self):
        return PostView.objects.filter(blogpost=self).count()

forms.py

class CreateBlogPostForm(forms.ModelForm):
    class Meta:
        model = BlogPost
        fields = ['title', 'body']

html

{% extends 'base.html' %}


{% block content %}

<style type="text/css">
  .create-form {
        width: 100%;
        max-width: 100%;
        padding: 15px;
        margin: auto;
    }

    .submit-button{
        max-width: 200px;
    }
</style>

<div class="container">
    <div class="row">
        <div class="col-lg-7 offset-lg-1">
            <form class="create-form" method="post" enctype="multipart/form-data">{% csrf_token %}

                <!-- title -->
                <div class="form-group">
                    <label for="id_title">Title</label>
                    <input class="form-control" type="text" name="title" id="id_title" placeholder="Title" required autofocus>
                </div>

                <!-- Body -->
                <div class="form-group">
                    <label for="id_body">Content</label>
                    {{form.media}}
                    <textarea class="tinymce" rows="10" type="text" name="body" id="id_body" placeholder="This blog is about..." required> {{form.body}} </textarea>
                </div>

                <!-- Submit btn -->
                <button class="submit-button btn btn-lg btn-primary btn-block" type="submit">POST</button>
            </form> 
        </div>
    </div>
</div>

{% endblock content %}

提前致谢。

当您拥有此代码时:

<textarea class="tinymce" rows="10" type="text" name="body" id="id_body" placeholder="This blog is about..." required> 
    {{form.body}} 
</textarea>

变量form.body中包含什么?我的猜测是你在那里有另一个 textarea 所以你最终在 TinyMCE 本身中放置了一个 textarea 而不是你想要编辑的 HTML 内容。