我正在使用 AJAX Wordpress 主题，但据我所知，问题不在于主题，而在于我添加的代码。
我使用“Contact-Form-7”作为一个特殊的下拉框。我正在使用它来创建一个易于访问的提交表单。
我以前使用过这些代码行，但我遇到的问题是单击按钮时该框不会显示。下面是两个链接和我使用的源代码。链接 1 是我添加此表单的 Ajax 站点。链接 2 与我们所做的形式相同，但它工作得很好。按钮在顶部，上面写着“请求约会”。
链接 1：http ://www.geigerandwood.com
链接2： http ://www.tobiasdental.com
标题中的代码行：
<!-- BEGIN: FREE Estimates Form -->
<div class="center-wrap">
<section id="drop-down-content">
<h1>Request an Appointment</h1>
<?php echo do_shortcode('[contact-form-7 id="173" title="Drop Down"]'); ?>
</section>
<section id="drop-down">
<a id="drop-down-toggle">Request an Appointment</a>
</section>
</div>
<!-- END: FREE Estimates Form -->
CSS中的代码行：
/* Free Estimates Drop Down Box */
body #drop-down {
transition: top 0.5s;
-moz-transition: top 0.5s;
-webkit-transition: top 0.5s;
-o-transition: top 0.5s;
width: 700px;
background-color: #333333;
position: absolute;
top: -30px;
left: 0;
z-index: 10000;
padding: 20px 0 10px 0; }
body #drop-down-content:after{
content: "";
position: absolute;
top: -7px;
left: 133px;
width: 15px;
height: 7px;
background: url("images/dark-arrow-up.png") no-repeat 0 0;
}
body #drop-down form {
zoom: 1;
clear: both; }
body #drop-down form:before, body #drop-down form:after {
content: "";
display: block; }
body #drop-down form:after {
clear: both; }
body #drop-down div {
width: 250px;
float: left;
margin-right: 25px; }
body #drop-down div input{
width: 250px;
}
body #drop-down label {
display: block;
color: #eeeeee;
margin-bottom: 10px;
font-style: italic;
text-transform: uppercase;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4); }
body #drop-down textarea {
height: 85px;
float: left;
margin-right: 25px; }
body #drop-down button {
float: left;
margin-left: 0;
font-size: 18px;
padding: 8px;
margin-top: 45px; }
body #drop-down.open {
top: 0; }
body #drop-down-toggle {
display: block;
text-indent: -9000px;
overflow: hidden;
background: url("images/topper_btn.png") no-repeat 0 0;
width: 243px;
height: 45px;
cursor: pointer;
position: absolute;
bottom: -44px;
right: 0; }
body #drop-down-content{
position: absolute;
display: none;
left: 440px;
top: 50px;
background-color: #333333;
padding: 18px;
border-radius: 5px;
z-index: 10000;
color: #fff;
font-weight: bold;
font-size: 14px;
}
body #drop-down-content input[type="text"]{
color: #521306;
font-size: 14px;
font-weight: bold;
font-family: "Swiss 721", Helvetica;
border: 3px solid #c5d0d7;
border-radius: 2px;
width: 247px;
}
body #drop-down-content input[type="file"]{
color: #521306;
font-size: 14px;
font-weight: bold;
font-family: "Swiss 721", Helvetica;
border: 3px solid #c5d0d7;
border-radius: 2px;
width: 247px;
}
body #drop-down-content p{
margin-top: 13px;
}
body #drop-down-content .wpcf7-submit{
background-color: #521306;
color: #fff;
float: right;
padding: 7px 12px;
font-size: 14px;
width: auto;
border: 0;
cursor: pointer;
}
/* Free Estimates Drop Down Box END */
在上面的代码中，当按下按钮时，将在“section id='drop-down-content'”中自动添加以下内容：
<section id="drop-down-content" style="display: none;"> <!--button is not clicked-->
<section id="drop-down-content" style="display: block;"> <!--button is clicked-->
我遇到的唯一问题是让它执行那个动作。我迷失了我所缺少的东西。任何帮助，将不胜感激。