js textarea标签问题
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js textarea标签问题相关的知识,希望对你有一定的参考价值。
如何在textarea标签中显示出用html代码写出来的效果,例如:
<textarea>abc<font color='red'>red</font>def</textarea>
怎样才能将textarea中的文字颜色设置为红色的效果显示出来,求大神指导
给点思路也行啊
给textarea 添加一个class 然后在CSS文件中写好样式就可以啦
<textarea class="fontColor">abc</textarea>
----css文件:
.fontColorcolor:red
粗糙的给你写了点,希望对你有帮助!追问
不是这个意思 我的意思是初始化时候只有一个,然后向其动态添加一段html代码进去,然后想要在这个textarea中显示出效果
追答你看这样行不行,添加事件
<html><head>
<script type="text/javascript" src="C:\\Users\\hwx5315697\\Desktop\\jquery.js"></script>
<script type="text/javascript">
function addHtml()
str ="<span style='color:red'>123</span>"
$('#addTextArea').append(str);
</script>
</head>
<body>
输入框:<textArea id="addTextArea">abc</textArea>
添加:<input type="button" onclick="addHtml();" value="add">
</body>
</html> 参考技术B textarea就是个单纯的文本框而已,不能有标签,更不能做出各种各样的颜色了。
你要用的名字叫编辑器,网上有很多:ckeditor什么的,百度一搜一大堆。
用起来也很简单,看几个例子就OK了!本回答被提问者和网友采纳 参考技术C <textarea rows="" rows="" style=" color:Red;"></textarea>追问
额 我是要动态添加进去的 不光是颜色 所有的那种效果类的标签都要实现的 要这么简单就好了 不过还是谢谢你啦
asp.net 有条件地禁用标签助手(textarea)
【中文标题】asp.net 有条件地禁用标签助手(textarea)【英文标题】:asp.net conditionally disable a tag helper (textarea) 【发布时间】:2016-01-19 00:27:07 【问题描述】:我想根据从模型评估的条件启用或禁用 textarea,并且我正在使用 textarea 标签助手。 换句话说,是这样的:
<textarea asp-for="Doc" @(Model.MustDisable ? "disabled" : "")></textarea>
但我收到以下设计时错误:标签助手“textarea”在元素的属性声明区域中不能有 C#。
然后我尝试了:
<textarea asp-for="Doc" disabled='@(Model.MustDisable ? "disabled" : "")'></textarea>
没有显示任何设计时错误,但呈现如下:
Model.MustDisable==true
呈现 disabled='disabled'
和 Model.MustDisable==false
呈现 disabled
。
因此文本区域将始终被禁用。
然后我尝试(删除's):
textarea asp-for="Doc" disabled=@(Model.MustDisable ? "disabled" : "")></textarea>
没有显示任何设计时错误,但呈现与前一个相同。
我怎样才能以正确的方式实现这一点?
【问题讨论】:
为什么不同时有条件地渲染 disabled 属性? 【参考方案1】:其实很简单,disable 属性已经按照你的意愿工作了——你可以传入一个布尔值:
<textarea asp-for="Doc" disabled="@Model.MustDisable"></textarea>
如果为 false,则不呈现 disabled
属性:
<textarea></textarea>
如果为真,disabled
属性设置为“禁用”:
<textarea disabled="disabled"></textarea>
【讨论】:
为什么这个投票不高?这是完美、雄辩且可能最“正确”的解决方案。 @RyanO'Neill 这就是它的工作原理!试试看,你会看到:-)。如果您发送 false,TagHelper 将根本不会打印出该属性。我也会更新我的答案以澄清。 @Jess - 它是一个内置的标签助手(我不知道我是否称它为魔法)docs.microsoft.com/en-us/aspnet/core/mvc/views/tag-helpers 哇,好神奇。在 Core 3.1 中确认 - 这应该是公认的答案。 @vmh 请接受这个作为答案。它按预期工作,在传递值false
时不呈现 disabled
属性。【参考方案2】:
我在使用选择标签助手时遇到了同样的问题,我尝试了一些东西并且它起作用了。 试试这个-
<textarea asp-for="Doc" disabled="@(Model.MustDisable ? "disabled" : null)"></textarea>
【讨论】:
我认为这不适用于所有浏览器。 ' disabled="" ' 将导致输入被禁用。 @user942620 你是对的,但只是在使用“”而不是 null 的情况下 这个!!!非常感谢!我仍然想知道为什么 MS 不允许常规 @(condition ? "disabled" : ""),但我打算扩展 TagHelper(对于这么小的东西来说工作量太大了!),这个解决方案拯救了我的一天! ;) @user942620 我知道这已经很老了,但是您的评论需要更正。的确,所有浏览器都应该将disabled="false"
呈现为禁用状态,但我们实际上并没有在这里编写 HTML。 标签助手正在编写HTML。如果标签助手看到disabled="false"
,它不会呈现disabled
属性。【参考方案3】:
textarea 标签助手不直接支持有条件地渲染禁用的文本区域。但您始终可以扩展 TextAreaTagHelper
并添加此功能。
所以创建一个继承自TextAreaTagHelper
类的新类。
[HtmlTargetElement("textarea", Attributes = ForAttributeName)]
public class MyCustomTextArea : TextAreaTagHelper
private const string ForAttributeName = "asp-for";
[HtmlAttributeName("asp-is-disabled")]
public bool IsDisabled set; get;
public MyCustomTextArea(IHtmlGenerator generator) : base(generator)
public override void Process(TagHelperContext context, TagHelperOutput output)
if (IsDisabled)
output.Attributes["disabled"] = "disabled";
base.Process(context, output);
在您的_ViewImports.cshtml
文件中,使用@addTagHelper
指令指定定义上述类的程序集,以便我们的新标签助手可用于其他剃须刀视图。
@addTagHelper "*, Microsoft.AspNet.Mvc.TagHelpers"
@addTagHelper "*,YourAssemblyNameHere"
现在在你看来,你可以像这样使用它
@model YourSomeViewModel
<textarea asp-for="Doc" asp-is-disabled="Model.MustDisable"></textarea>
其中SomeViewModel
具有Doc
和MustDisable
属性。
public class YourSomeViewModel
public string Doc set;get;
public bool MustDisable set;get;
【讨论】:
比最高投票的答案更好,也比使用三元表达式添加禁用属性更好。谢谢!【参考方案4】:我将这个单独发布,因为我没有足够的声誉来为 Shyju 的答案添加评论。
如果您从默认标签助手之一继承,然后在 _ViewImports.cshtml 中同时注册默认标签助手和您的自定义标签助手,那么这两个标签助手都将针对指定的标签执行。
以下:
[HtmlTargetElement("textarea", Attributes = ForAttributeName)]
public class MyCustomTextArea : TextAreaTagHelper
private const string ForAttributeName = "asp-for";
...
使用以下_ViewImports.cshtml:
@addTagHelper "*, Microsoft.AspNet.Mvc.TagHelpers"
@addTagHelper "*,YourAssemblyNameHere"
MyCustomTextArea
和 TextAreaTagHelper
都将为每个 textarea 标签执行。
我没有注意到为 textareas 生成的输出有任何问题,但是我遇到了从其他默认标记帮助程序继承的问题。解决方法是去掉 _ViewImports.cshtml 中的默认标签助手。
@addTagHelper "*, Microsoft.AspNet.Mvc.TagHelpers"
@addTagHelper "*,YourAssemblyNameHere"
@removeTagHelper "Microsoft.AspNet.Mvc.TagHelpers.TextAreaTagHelper, Microsoft.AspNet.Mvc.TagHelpers"
【讨论】:
@removeTagHelper Microsoft.AspNetCore.Mvc.TagHelpers.InputTagHelper, Microsoft.AspNetCore.Mvc.TagHelpers以上是关于js textarea标签问题的主要内容,如果未能解决你的问题,请参考以下文章
使用 JS 和 PHP 将 textarea 内容保存在文件中
UBB 代码 [textarea] - 不要在标签 [textarea][/textarea] 中将 \n 替换为 <br>
如何在 Javascript 中设置 textarea 值?