在段落行中单击时切换直通

Question

我正在尝试为一堆单词（项目 #1、项目 #2、项目 #3）创建点击 line-through。我希望它在点击时是直通的，如果第二次点击同一个词，直通应该再次消失。

<p>
Item #1<br>
Item #2<br>
Item #3<br>
</p>

我更喜欢css.

Answer 1

每个项目文本都应由 span 包裹以更改其属性。

这是一个使用 JQuery 的简单演示：

$("#parg").find("span").click(function(){
     $(this).toggleClass("line-through");
});

.line-through{
     text-decoration: line-through;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p id="parg">
<span>Item #1</span><br>
<span>Item #2</span><br>
<span>Item #3</span><br>
</p>

在段落行中单击时切换直通

Toggle Line-through on click in paragraph lines

html

javascript

css

line-through