我正在尝试使用if和else来更改我的WordPress站点中一个div的内容。我想要的是:
我有一组8个按钮,希望每个按钮在我的页面的div中放置一个特定的数据(短代码),因此,假设当用户单击按钮1时,他在我的站点的内容区域中看到数据1,当他单击按钮2时,数据1消失,显示数据2。
由于我对Java和PHP还很陌生,我不确定解决我的问题的最佳方法。我尝试过使用JQuery的hide和show,但我认为以后更新数据会很麻烦。然后我考虑使用If/Else或Variables。由于我对这两种解决方案都很陌生,我首先尝试If/Else解决方案,因为它的概念听起来更容易。
我试过下面的代码,但是不起作用。div中的数据没有变化,我不知道为什么。
/* Style */
#content {
width: 100%;
padding: 50px 0;
text-align: center;
background-color: lightblue;
margin-top: 20px;
}
#btn-a {
background-color:blue;
color:yellow;
}
#btn-b {
background-color:red;
color:yellow;
}
/* HTML */
<button id="btn-a" onclick="myFunction()">Button A</button>
<button id="btn-b" onclick="myFunction()">Button B</button>
<div id="content"></div>
/* Script */
function myFunction() {
if(document.getElementById('btn-a').clicked == true {
document.getElementById("content").innerHTML = "Yay A! [shortcode-A]";}
else-if(document.getElementById('btn-b').clicked == true {
document.getElementById("content").innerHTML = "Yay B! [shortcode-B]";}
}
正如我所说的,我是一个编码新手,所以我非常感谢任何对我的代码的帮助或者关于我应该尝试的新方法的建议。
原谅我的法语和谢谢。
2条答案
按热度按时间46scxncf1#
有很多方法可以向元素添加特定的内容。下面我使用您提供的标记来设置一些内容。
你可能想在你的页面上添加标签,绝对没有必要使用
jQuery
。这是另一个将内容添加到
html
而不是包含在JavaScript
中的示例。一个一个三个一个一个一个一个一个四个一个一个一个一个一个五个一个
0h4hbjxa2#
谢谢你,prettyinpink。按照你的建议和一些W3Schools的例子,我已经得到了一个新的代码,更好地工作对我所需要的。但我仍然有一个问题。
当我点击第三组按钮(产品有效性)时,它们会显示它们应该显示的内容,但按钮也会马上消失。我希望它们保持可见,直到按下一个新按钮。
我该怎么做呢?
要执行该问题,请单击以下按钮:产品2〉类型1〉12个月。