JS/HTML：可编辑的，多行文本没有下划线

Question

在我的HTML代码中，我有一个可编辑的，textarea的是这样的：

<span editable-textarea="category.name">{{category.name}}</span> 

默认的文本中现在有一个虚线下划线。我不想要虚线下划线，但我不明白。我尝试了以下几种风格：

<span editable-textarea="category.name" style="text-decoration: none; text-underline: none">{{category.name}}</span> 

但即使是文字修饰或文本下划线也可以将其删除。其他解决方案？

P.S. category.name保存在我的js数据中。我认为它在这里并不重要。可以是每个文本。

Answer 1

你必须改变边框底部

添加这种风格：

border-bottom: none; 

Here你有一个工作提琴。

Answer 2

此代码可以帮助你 -

js代码

document.getElementById("editable-span").spellcheck = false; 

HTML

<span id="editable-span" editable-textarea="category.name">{{category.name}}</span> 

虚线出现可能是由于拼写检查。

Answer 3

请尝试这种方式

<span editable-textarea="category.name" style="border:none;">{{category.name}}</span>