textarea自动加高代码

(function($){
$.fn.extend({
textareaAutoHeight: function (options) {
this._options = {
minHeight: 0,
maxHeight: 1000
}

this.init = function () {
for (var p in options) {
this._options[p] = options[p];
}
if (this._options.minHeight == 0) {
this._options.minHeight=parseFloat($(this).height());
}
for (var p in this._options) {
if ($(this).attr(p) == null) {
$(this).attr(p, this._options[p]);
}
}
$(this).keyup(this.resetHeight).change(this.resetHeight)
.focus(this.resetHeight);
}
this.resetHeight = function () {
var _minHeight = parseFloat($(this).attr("minHeight"));
var _maxHeight = parseFloat($(this).attr("maxHeight"));

if ($.support.leadingWhitespace) {
$(this).height(0);
}
var h = parseFloat(this.scrollHeight);
h = h < _minHeight ? _minHeight :
h > _maxHeight ? _maxHeight : h;
$(this).height(h).scrollTop(h);
if (h >= _maxHeight) {
$(this).css("overflow-y", "scroll");
}
else {
$(this).css("overflow-y", "hidden");
}
}
this.init();
}
});
})(jQuery)

转载于:https://www.cnblogs.com/anyaran/p/3478072.html

<textarea>标签通常用于在网页上创建文本区域,允许用户通过键盘输入或粘贴文本。在输入或粘贴文本时,如果文本中包含HTML代码,浏览器会将其作为纯文本显示,而不会将其解析为HTML元素。 如果要在<textarea>中显示HTML代码并使其被解析为HTML元素,可以使用一些技巧。其中一种方法是使用JavaScript将HTML代码解析为DOM元素,然后将DOM元素添加到<textarea>中。另一种方法是使用contentEditable属性,将<textarea>设置为可编辑状态,并在其中输入HTML代码。 以下是一个示例,演示如何使用JavaScript解析HTML代码并将其添加到<textarea>中: ```html <textarea id="myTextarea"></textarea> <script> const htmlCode = '<h1>Hello, World!</h1>'; const parsedHtml = new DOMParser().parseFromString(htmlCode, 'text/html').body.firstChild; const myTextarea = document.getElementById('myTextarea'); myTextarea.appendChild(parsedHtml); </script> ``` 在上面的示例中,我们首先创建了一个<textarea>元素,并为其设置了一个ID。然后,我们定义了一段包含HTML代码的字符串。接下来,我们使用DOMParser API 将HTML代码解析为DOM元素,然后将其添加到<textarea>元素中。 请注意,这种方法可能会破坏<textarea>的默认行为,因此在实际使用中需要仔细考虑。另外,由于<textarea>元素是单标签元素,因此无法使用innerHTML属性将HTML代码添加到<textarea>中。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值