使用ID执行javascript函数

Question

我有添加或删除文字的功能

function additionalText()

当我使用时：

<a id="toggleButton" class="moreText" onClick"additionalText()" >See More</a>

该功能正确执行。

但是，我希望在我的.js文件中包含所有JavaScript，并使用ID id =“toggleButton”来触发该函数。当我使用时：

onclick = function () {
additionalText();
}

我可以点击页面的任意一点，然后显示其他文字。我只是想在点击“查看更多”时执行它。我不想使用jQuery，但我知道它与事件监听器和getElementById有关，但我很难过 - 有人可以帮忙吗？感谢。

Answer 1

1 您可以通过

轻松完成此操作

document.getElementById('moreText').onclick = function () {
additionalText();
}

2 如果您希望onclick通过HTML，则应该使用相同的符号：

onClick="additionalText()"
       ^Magic!

简单onclick会假设您要将活动添加到window。此外，如果您使用的是选项＃2，请确保在窗口加载后未定义 <{1>}功能，否则您的HTML将无法看到它。

Answer 2

有了这个：

document.getElementById('toggleButton').addEventListener('click', function () {
   additionalText();
});

如果您必须支持旧浏览器，请执行以下操作：

document.getElementById('toggleButton').onclick = function () {
   additionalText();
};

干杯

Answer 3

您将该功能添加到常规onclick事件中。 这将通过每次点击执行该功能。

试试这个

document.getElementById("toggleButton").onclick = additionalText();

Answer 4

或者在JQuery中我会使用此策略，因为它会在您尝试将事件附加到它之前确保您的元素已加载。

$(function() { 
    $('#toggleButton').on('click', function() {
        additionalText();
    });
});