javascript - 使用 javascript 链接显示更多文本

Question

我一直在尝试使用 JavaScript 获取一个链接来显示更多文本。我知道如何使用按钮来完成此操作，但类似的方法似乎不适用于链接。

这是我的标记:

<form name="form">      
    <a href="Home.html" onClick="more(event)">Read More</a>
</form>

<p id="atext"><p>
<script src="Home.js"></script>

还有我的 JavaScript 代码:

function more() {
    e.preventDefault();
document.getElementById("atext").outerHTML = 'It touches many issues in our lives and packs a hell of a plot twist';
}

我知道你可以使用 jQuery 做类似的事情，但我发现的唯一的事情就是当你将鼠标悬停在文本上时显示文本。

Answer 1

我不明白您为什么要将链接包装到表单中。您可以将其从表单中删除，然后简单地执行类似的操作:

function more(e) {
    e.preventDefault();
    document.getElementById("atext").outerHTML = 'It touches many issues in our lives and packs a hell of a plot twist';
}

<a onClick="more(event)">Read More</a>
<p id="atext"></p>

此外，您还可以从链接中删除 href，因为您阻止了它的默认操作。