Javascript Onclick 函数“未定义”

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/38051376/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 21:01:55  来源:igfitidea点击:

Onclick function "is not defined"

javascriptphpjquerywordpress

提问by Atrag

I am fairly new to wordpress and am trying to define and call a function but cannot get it to work.

我对 wordpress 相当陌生,正在尝试定义和调用一个函数,但无法使其工作。

The following code appears in a php file that is called from the content.php file using get_template_part.

以下代码出现在使用 get_template_part 从 content.php 文件调用的 php 文件中。

<div onclick="checkAllTopicCheckBoxes()"> </div>

I added the following code to the bottom of the function.php file:

我在 function.php 文件的底部添加了以下代码:

function checkAllTopicCheckBoxes() {
    alert("Hello! I am an alert box!!");
}

When I click the element it returns:

当我单击该元素时,它返回:

(index):363 Uncaught ReferenceError: checkAllTopicCheckBoxes is not defined.

(index):363 Uncaught ReferenceError: checkAllTopicCheckBoxes 未定义。

Can anyone please help me?

谁能帮帮我吗?

回答by Sagar Sahni

Using OnClick or similar attributes is very poor practice.

使用 OnClick 或类似的属性是非常糟糕的做法。

Using Javascript Event Listener is a much better way of doing this. Registering an event in a modern way is the unobtrusive wayof handling events. Also to register more than one event listener for the target you can call addEventListener() for the same target.

使用 Javascript 事件侦听器是一种更好的方法。以现代方式注册事件是处理事件的不显眼的方式。此外,要为目标注册多个事件侦听器,您可以为同一目标调用 addEventListener()。

HTML:

HTML:

<div id="checkAllTopicCheckBoxes"> </div>

Your JavaScript is supposed to look like this:

你的 JavaScript 应该是这样的:

document.getElementById ("checkAllTopicCheckBoxes").addEventListener ("click", myFunction, false);

function myFunction() {
  alert("Hello! I am an alert box!!");
}

HTML attribute(such as Onclick) should be avoided as it concerns the content/structure and behavior are not well-separated, making a bug harder to find.

应该避免HTML 属性(例如 Onclick),因为它涉及内容/结构和行为没有很好地分离,从而更难找到错误。

回答by Lilamuse

What you wrote is a Javascript function, it must be surrounded by in HTML code. Have you written your function in something like:

你写的是一个Javascript函数,它必须被HTML代码包围。你有没有写过类似的函数:

echo('<script>function checkAllTopicCheckBoxes() { alert("Hello! I am an alert box!!");}</script>');

Also, I think Wordpress must have some function ready to use to add scripts. Try to have a look on wp_enqueue_script (string $handle, string $src = false, array $deps = array(), string|bool|null $ver = false, bool $in_footer = false);

另外,我认为 Wordpress 必须有一些功能可以用来添加脚本。试着看看wp_enqueue_script (string $handle, string $src = false, array $deps = array(), string|bool|null $ver = false, bool $in_footer = false);

edit: I just found that question, it may answer yours: How to write a Javascript function inside the functions.php of Wordpress?

编辑:我刚刚发现了这个问题,它可能会回答你的问题:如何在Wordpress的functions.php中编写一个Javascript函数?

回答by Alongkorn Chetasumon

function checkAllTopicCheckBoxes() {
    alert("Hello! I am an alert box!!");
}

must be not in <? ... ?>and must have <script>...</script>wrap, e.g.,

必须不在<? ... ?>并且必须有<script>...</script>包装,例如,

======== sample.php =======
<? 
// php script is here
?>

<script>
function checkAllTopicCheckBoxes() {
  alert("Hello! I am an alert box!!");
}
</script>

or if you want to include js inside php script, you must echoit like this

或者如果你想在 php 脚本中包含 js,你必须echo像这样

======== sample.php =======
<? 
// php script is here

echo '<script>';
echo 'function checkAllTopicCheckBoxes() {';
echo '  alert("Hello! I am an alert box!!");';
echo '}';
echo '</script>';

?>

回答by Rahul Makhija

I faced the same error like you.

我遇到了和你一样的错误。

If we use the onclick html attribute, we need to define that onclick function within the same html element (by using tags).

如果我们使用 onclick html 属性,我们需要在同一个 html 元素中定义该 onclick 函数(通过使用标签)。

It is best practice to create click event listener using javascript/jquery, than using onclick html attribute.

最好的做法是使用 javascript/jquery 创建点击事件侦听器,而不是使用 onclick html 属性。