使用选择选项字段值隐藏和显示联系表单 7 字段答案

【问题标题】：Hide and show contact form 7 field using Select optiond field values使用选择选项字段值隐藏和显示联系表单 7 字段
【发布时间】：2018-02-27 09:49:38
【问题描述】：

我正在为我的运营商表格使用联系表格 7 插件。现在我正在使用 java 脚本选择选项值来隐藏/显示一些字段。

例子：

如果第一个选择框选项值为 (i) 教师，则显示另一个第二个选择选项字段，如果在第一个选择框中用户选择其他选项，则隐藏第二个选择选项字段。

为此，请查看此屏幕截图 -> http://nimb.ws/uxHNjy

为此，我使用了以下 JS：

<script type="text/javascript">
    jQuery(document).ready(function() {
        jQuery("#subject_forpost").hide();
    });
    </script>
    <script type="text/javascript">
       jQuery(".career_postapplied").change(function(){
       var value = this.value;
       if (value == "(i) Faculty"){
         jQuery("#subject_forpost").show();
       }
       else
       {
         jQuery("#subject_forpost").hide();
       }
     });
</script>

上面的 JS 对我很有用。但是我在电子邮件正文中遇到了一个问题。当用户选择“（i）Faculty”选项，然后在第二个选择选项中选择任何主题，如果用户改变主意并在第一个选择选项中选择其他选项，然后在第二个选择选项字段中隐藏。这很好，但是当管理员收到该邮件时，电子邮件正文中也会显示第二个选择选项值。

这是个问题。那么，如果用户改变主意并在第一个选择选项字段中选择其他选项，我如何在发送表单邮件之前清除第二个选择选项值。

谢谢。

【问题讨论】：

你可以试试这个插件更好：wordpress.org/plugins/cf7-conditional-fields
那个插件我试过但没用过。
确保 HTML 中只有一个 .career_postapplied 类
是的，我在 HTML 中只有一个 .career_postapplied 类

标签： javascript wordpress select options contact-form-7

【解决方案1】：

我在 else 条件部分添加了以下代码并修复了问题。

jQuery("#subject_forpost").find('select').val('');

所以工作代码是：

<script type="text/javascript">
    jQuery(document).ready(function() {
        jQuery("#subject_forpost").hide();
    });
    </script>
    <script type="text/javascript">
       jQuery(".career_postapplied").change(function(){
       var value = this.value;
       if (value == "(i) Faculty"){
         jQuery("#subject_forpost").show();
       }
       else
       {
         jQuery("#subject_forpost").find('select').val('');
         jQuery("#subject_forpost").hide();
       }
     });
</script>

【讨论】：