代码在 W3shool 测试页面中有效，但在 Joomla 中无效答案

【问题标题】：Code works in W3shool test page but not in Joomla代码在 W3shool 测试页面中有效，但在 Joomla 中无效
【发布时间】：2016-08-22 20:05:03
【问题描述】：

我正在测试这段代码，它在这里工作http://www.w3schools.com/js/tryit.asp?filename=tryjs_debugger，但不在我的 Joomla 页面上。 Chrome 控制台错误位于帖子底部

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
function toggleDiv(divId) {
   $("#"+divId).toggle();
}
</script>

<a href="javascript:toggleDiv('myContent');" style="background-color: #ccc; padding: 5px 10px;">Toggle Button</a>
<div id="myContent" style="background-color: #aaa; padding: 5px 10px;">
    The content in this div will hide and show (toggle) when the toggle is pressed. 
</div>

63-tet.html:168 Uncaught TypeError: Cannot read property 'toggle' of nulltoggleDiv @ 63-tet.html:168(anonymous function) @ VM4704:1

我已经检查了源页面，并且我的代码由服务器原封不动地发回给我：

<div itemprop="articleBody">
		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
function toggleDiv(divId) {
   $("#"+divId).toggle();
}
</script>

<a href="javascript:toggleDiv('myContent');" style="background-color: #ccc; padding: 5px 10px;">Toggle Button</a>
<div id="myContent" style="background-color: #aaa; padding: 5px 10px;">
    The content in this div will hide and show (toggle) when the toggle is pressed. 
</div> 	</div>

【问题讨论】：

标签： toggle show-hide

【解决方案1】：

听起来 Joomla 正在过滤/将某些关键字列入黑名单。您可以看到它正在尝试调用该函数：

nulltoggleDiv 并访问它的切换属性。

如果你按 f12 并搜索“toggleDiv”，你应该可以看到变形后的实际 html。

查看此文档：

https://docs.joomla.org/Help16:Content_Article_Manager#Filtering_Options_.28HTML.29

来自文档：

Black List Filters
The default filter method in Joomla! is 'Black List'. The default 'Black List' contains the following tags to exclude:

'applet', 'body', 'bgsound', 'base', 'basefont', 'embed', 'frame',   'frameset', 'head', 'html', 'id', 'iframe', 'ilayer', 'layer', 'link', 'meta', 'name', 'object', 'script', 'style', 'title', 'xml'
The default 'Black List' contains the following attributes to exclude:

'action', 'background', 'codebase', 'dynsrc', 'lowsrc'
You can 'Black List' (disallow) additional tags and attributes by adding to the Filter tags and Filter attributes fields, separating each tag or attribute name with a space or comma. If you select a Filter Type of "Black List", this list will always be used, plus any additional tags and attributes you add.

【讨论】：

好像不是这样，页面的源代码显示我的代码在那里，见上。有趣的是，如果你按上面的“运行”，你会看到一个错误，但我无法理解（我是初学者）
当我按下运行并单击切换按钮时，代码工作正常。它按预期隐藏和显示 div。
有时我在刷新页面时得到这个i.imgur.com/bi1dqTe.png，这与我的错误类似
我也在这里测试了这段代码：stackoverflow.com/questions/10960753/…，我收到了类似的错误。我怀疑这是因为 $("#" + divId) 的解释方式。 divId 正在正确传递...
绝对是 Joomla 但我不知道如何隔离问题。我已经在独立页面上测试了代码

【解决方案2】：

问题似乎出在这个参考文献上

   $("#"+divId).toggle();

在我用

替换上面的之后

  var element = document.getElementById(divId);
   element.toggle();

代码有效

【讨论】：