Joomla文章或模块中的JavaScript未被执行

Question

我想使用一段Javascript代码来过滤表格。我在没有CMS的情况下测试了这个代码，它完美地工作了。然而，当我将它移动到Joomla时，Javascript代码无法被识别/执行。我猜测是有些东西在阻止或冲突。

我试着用Sourcerer添加代码，还将它添加到一个Flexi代码模块中。但是，并没有起任何作用。我在Stackoverflow上阅读了一些其他帖子，但它们都与此不相关或未提供解决方案。

这不是像RS Firewall这样的程序在阻止，我也检查了JCE和文章选项的设置，允许Javascript的所有权限都没问题。

我错过了什么？我该如何使它工作？

这是代码：

<script>
function myFunction() {
var input, filter, table, tr, td, i;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
table = document.getElementById("myTable");
tr = table.getElementsByTagName("tr");
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[0];
if (td) {
if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
} 
}
}
</script>

如之前所说，我已经在 Joomla 以外的环境下测试了整个代码，代码本身是没有问题的。因此与 Joomla 的组合使其成为一个问题。

非常感谢任何帮助！

编辑： 我创建了一个测试页面：test filter table JavaScript 片段位于源代码的第 702 行左右。

谢谢！

- Jason

---

通过检查HTML来检查生成的表格ID。 - Sully

JavaScript是否出现在您的页面源代码中？该脚本仅包含一个本身无用的函数。您是否也包含了调用此函数的代码？ - Sven Bluege

谢谢。是的，表格ID是相同的。而且，代码确实在页面源代码中。这就是我放置的确切代码：https://www.w3schools.com/howto/howto_js_filter_table.asp - Jason

你看到任何错误信息吗？你能分享一下那个网站的链接吗？ - Sven Bluege

@SvenBluege 我在上面添加了一个测试网址。到目前为止谢谢！ - Jason

Answer 1

答案很简单。你包含了必要的代码，但忘记调用它了。w3c 的示例包含一个事件绑定，但我在你的源代码中并没有看到。

例如：

<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names..">

你的代码：

<input id="myInput" title="Type in a name" type="text" placeholder="Search for names.." />

你需要在某个地方调用函数myFunction()，否则什么也不会发生。如果你无法直接将这个onkeyup添加到输入框中，你也可以使用以下JavaScript代码片段：

$( document ).ready(function() {
    jQuery('#myInput').on('keyup', myFunction);
});

- Sven Bluege

---

{btsdaf} - Jason