JQuery 根据联系表 7 中的选择值自动填充文本字段答案

【问题标题】：JQuery automatically fill textfield based on select values in Contact Form 7JQuery 根据联系表 7 中的选择值自动填充文本字段
【发布时间】：2020-05-26 16:57:07
【问题描述】：

将 CF7 用于 wordpress，我想使用下拉列表中选择的选项填充文本字段。预期的结果是，当我在“oggetto”中选择特定值时，文本字段“recipe”将填充一个字符串。我无法弄清楚为什么这个简单的 jquery 脚本不起作用：

脚本：

        <script text="text/javascript">
        console.log("Inside the script");
        var valore; 
        jQuery('#oggetto').change(function(){
        console.log("I'm inside");
        valore = jQuery('#oggetto').val();
        console.log(valore);
        if (valore == "Corsi") {
        console.log("Now I know what to do");
        //jQuery('#recipe').val("corsi@mydomain.com");
        document.getElementById("recipe").value = "corsi@mydomain.com"
        }
        else  {
        jQuery('#recipe').val("everybody@mydomain.com");
        }
        });
        </script>

表单，其中“id:”定义了所涉及的两个字段的 id：

<div class="row">
<div class="col-sm-6">[text* your-name placeholder "Nome e cognome *"]</div>
<div class="col-sm-6">[email* email placeholder "Email *"]</div>
<div class="col-sm-6">[tel phone "Telefono"]</div>
<div class="col-sm-12">[email* destinatario id:recipe]</div>
<div class="col-sm-6">[select* subject id:oggetto "Oggetto della richiesta *" "Corsi" "Informazioni generali" "Informazioni sugli eventi" "Partnership" "Altro"]</div>
<div class="col-xs-12">[textarea* message placeholder "Messaggio *"]


[submit class:btn "Invia"]</div><div class="col-xs-12"></div></div>

我用过

document.getElementById("recipe").value

和

jQuery('#recipe').val("everybody@mydomain.com");

经过多次尝试。但是函数内部所做的每一个更改似乎都没有用，因为通过 console.log... 代码执行似乎在更改事件之前停止。知道我的脚本出了什么问题吗？

【问题讨论】：

对不起...值... valore = jQuery('#oggetto').val();
在这个小提琴中我的脚本似乎可以工作...jsfiddle.net/m460t7pu/1
你有一个实时的 Wordpress 网站来显示这个问题吗？
您必须在您的电子邮件字段中添加类似 on blur 的内容

标签： javascript jquery wordpress contact-form-7

【解决方案1】：

好的，好的，好的。对于那些对 CF7 有同样问题的人......问题是任何 js 代码都必须在格式化代码之后。所以......我的代码是正确的（document.getElementById("recipe").value 和 jQuery('#recipe').val("everybody@mydomain.com"); ）。只需将脚本放在表单之后，这样......

【讨论】：