Question

我已经使用WordPress插件创建了一个表单联系表单7.我目前有一个字段是一个下拉列表，理想情况下，从该列表中选择任何选项并在下面有一个描述会更好每次选择主题时。

原因是我目前正在设计用于教育目的的预订表格，下拉列表包含各种主题。一旦你点击主题，每次它会自动显示它下面的课程描述就会很棒。

＆＃13;

.enquiry-contain {
    padding:100px 0;
  }

  .school-enquiry {
    background-color:rgba(0, 0, 0, 0.72);
    border-radius:10px;
    padding:50px;
  }

  .bg-image {

    width:100%;
    background: url(https://www.durrell.org/wildlife/wp-content/uploads/2017/01/MG_3919-v2.jpg) fixed;
    color: #fff;
    height: 100%;
    margin: 0;
    background-position: center 0;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .wc-durrell-footer {
    margin-top:0;
  }

  .wpcf7-text, .wpcf7-date, .wpcf7-select, .wpcf7-textarea{
    color: black;
    font-family: 'AvantGardeGothicITCW01B 731069';
    padding:5px;
    border-radius: 5px;≈
  }

  .wpcf7-textarea, .session-choice {    
    width: 100%;
  }

＆＃13;

<?php get_header(); ?>

<section class="bg-image">

<div class="container enquiry-contain">

<h1 style="text-align:center;">Jersey Booking Form</h1>
<div class="row" style="margin: 0 3px 0 3px;">
<div class="col-md-2 hidden-sm"></div>
<div class="col-md-1 hidden-sm"></div>
<div class="school-enquiry col-md-6">
<h6 style="color:#70D100;">Please complete all fields below before you click submit</h6>
<?php echo do_shortcode('[contact-form-7 id="10012426" title="Jersey school booking form"]'); ?>
</div>
</div>
  
</div>

</section>

<?php get_footer(); ?>

＆＃13;

这是WordPress联系表7代码：

[text* your-name placeholder "Name of teacher *"]
[text* school-name placeholder "Name of school *"]
[email* your-email placeholder "Email address"]
[tel* phone-number placeholder "Phone number"]

可能的访问日期：

[date* date-of-visit placeholder "Potential date of visit"]

潜在的访问时间：

[select* time-of-visit include_blank "9:30PM " "10:30PM "
 "11:30PM " "12:30PM " "13:30PM " "14:30PM " "15:30PM " "16:30PM"]

选择您的会话：

[select* taught-sessions class:session-choice 
   "KS1 - Classification " 
   "KS1 - Food chains and habitats " 
   "KS2 - Gerald Durrell " 
   "KS2 - Rainforest " 
   "KS2 - Teeth " 
   "KS3 - The Gerald Durrell Story " 
   "KS3 - The Gerald Durrell story " 
   "KS3 - Ethics illegal trade in wildlife" 
   "KS3 - Biodiversity and conservation explored " 
   "KS3* - Introduction to Durrell " 
   "KS3* - Animal observations** " 
   "KS4 - Animal observations** " 
   "KS4 - Ethics - Mountain chickens " 
   "KS4 - Biodiversity and conservation extended " 
   "KS4* - Microbiology in the workplace** " 
   "AS & A-LEVEL - Animal observations** " 
   "AS & A-LEVEL - Geography case study* "
 ]

有关会话的更多信息：

[textarea Additional-information maxlength:200 
  placeholder "Additional information... 
  e.g physical or learning difficulties"]

[submit "Submit"]

Answer 1

您必须具体说明您的问题。只是看到你的表格，我们无法回答你的问题。你在哪里存储哪些描述是针对哪个主题的数据？

你可以做类似的事情，例如下拉列表

class="subject"

然后从中选择任何主题。

 sub1="MATH";
 SUB2="English";
 Desc1="MATH is Love";
 Desc2="English is important";

$(".subject").change(function()
     var sub= (this).val();
 if(sub== sub1)
   {
      $(".desc").html(Desc1);
   }
  else{
     $(".desc").html(Desc2);
   }
   });

desc是一个给你想要显示描述的div或输入的类。希望这会对你有所帮助。

Wordpress联系表7 - 使用Jquery预订表单功能

1 个答案: