Question

是否可以为控件中的部分文本加下划线。

我在jquery中确实喜欢这个，但没有出现下划线。任何示例代码示例？

<textarea rows = "3" cols = "50" id = "TestName" ></textarea>

Jquery的

 var dvHTML = ''
 dvHTML = '<span style=text-decoration: underline;>' + "Hello world" + '</span>';
$("#TestName").html(dvHTML);

输出我只得到Hello world，标签没有被识别

Answer 1

你不能在textarea上做到这一点，如果你需要风格，你需要一些WYSIWYG。或者你可以通过在textarea上面添加div来伪造用户，并自己隐藏textarea。

Answer 2

您可以使用contenteditable div。

<div contenteditable="true">I am saying <span>Hello</span></div>

<强> Working Fiddle

Answer 3

如果您只想为可以使用的特定文字加下划线：

<textarea style="text-decoration:underline;" rows="20" cols="30" id="text">All are Welcome!!</textarea>


$("document").ready(function() {
    $("#text").val($("#text").text());
    $('textarea').keypress(function(e) {
          $(this).css('text-decoration','none');
    });
});

演示：http://jsfiddle.net/fiddleyetu/czZWp/6/

Answer 4

您不能使用文本区域，解决方案是使用可编辑的div。

HTML：

<div id="foo">
</div>

JS：

var dvHTML = '<span style="text-decoration: underline;">Hello world</span>';

$("#foo").html(dvHTML).click(function() {
    this.contentEditable = true;                
});

<强> THE LIVE DEMO.

Answer 5

首先在"标记中添加双引号逗号style，然后在divHtml = ''之后添加分号

这将有效 -

<!DOCTYPE html>
<html>
<body>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<textarea rows = "3" cols = "50" id = "TestName" style="text-decoration: underline;"></textarea>
<script>
var dvHTML = '';
 dvHTML =  "Hello world" ;
$("#TestName").html(dvHTML);
</script>
</body>
</html>

为了让您了解其中的差异，您在HTML中输入的textarea将成为其文字。它会将其呈现为文本。因此，将文本修饰添加为文本区域的样式。而且，关于你原来的问题 - textarea无法实现。看到这个 -

Rendering HTML inside textarea

在Textarea中强调了部分文本

5 个答案: