首页 > 解决方案 > How to set the row size of a jquery minimal rich text editor plugin

问题描述

I am attempting to customize a jquery-based rich text editor. I'd like to have two on a page, one with a height of 5 rows and the other with a height of 10 rows. There are "instructions" for customizing the parameters, but I cannot figure out how to implement the instructions. I've tried, for example, placing a property and value pair as follows, but it simply breaks the control altogether. (What appears on the screen is simply a textarea control as specified by the CSS, with no rich text editing capabilities.)

    $(document).ready(function() {  
        $("#fullDescription").richText({
            height:5
        });
    });

I also tried height:100px with the same result. The rich-text-editor does work if the parens on .richText() are left empty. But the size of the control cannot be changed and as far as I can tell, and as a client I can add rows indefinitely (the scroll bar kicks in to accommodate) rather than having the control limit the number of rows to the CSS rows value.

The CSS for the control is as follows (making use of bootstrap and thymeleaf):

<textarea class="form-control" th:field="*{fullDescription}" 
            rows="5" required>
</textarea>

Any thoughts on how to accomplish customizing the height of the textarea?

标签: htmljquerycssbootstrap-4rich-text-editor

解决方案


我有一个答案要分享,由 codejava.net 的 Nam Ha Minh 提供给我。

标签中的 Bootstrap 类调用<textarea>是干扰源。一旦它被删除,高度属性就可以正常工作。不过,我应该提一下,该值表示像素,因此应指定大于 5 的值!

我还没有探索任何类标签的存在是否会导致干扰,这与 Bootstrap 无关。


推荐阅读