如何根据CF7中的下拉选项更改文本字段的值
如何根据CF7中的下拉选项更改文本字段的值
提问于 2019-06-12 03:13:51
我正在使用Contact Form7 Wordpress插件创建一个表单。我希望根据同一表单中的下拉菜单中的用户选项自动为文本字段分配值
我已经尝试了这个表单标签和下面的内联代码，但没有成功。对我做错了什么有什么建议吗？
<script language="javascript" type="text/javascript">
// On every 'Change' of the drop down with the ID "FavoriteColorDropDown" call the displayTextField function
document.getElementById("FavoriteColorDropDown").addEventListener("change", displayTextField);
function displayTextField() {
// Get the value of the selected drop down
var dropDownText = document.getElementById("FavoriteColorDropDown").value;
switch (dropDownText){
case pink:
document.getElementById("EnterFavoriteColorLabel").value = "pink";
break;
case red:
document.getElementById("EnterFavoriteColorLabel").value = "red";
break;
case purple:
document.getElementById("EnterFavoriteColorLabel").value = "purple";
break;
}
}
</script><label> Your Name (required)
[text* your-name] </label>
<label> Your Email (required)
[email* your-email] </label>
<label> Your Favorite Color
[select drop-down-menu id:FavoriteColorDropDown "Pink" "Red" "Purple" "Other"] </label>
<label id="EnterFavoriteColorLabel"> Please Specify Your Favorite Color
[text favorite-color] </label>
[submit "Send"]
回答 1
Stack Overflow用户
发布于 2019-06-12 03:35:14
由于我无法想象如何生成超文本标记语言，因此我建议首先确保调用displayTextField方法。如何像这样更改获取值的方式(您可能需要根据生成html的框架的上下文更改代码)：
document.getElementById("FavoriteColorDropDown").addEventListener("change", displayTextField(this.value))
const displayTextField = val => {
// Get the value of the selected drop down
const dropDownText = val
// bla bla blah...
}此外，如果您可以按照建议将if替换为switch，并且如果var是const，那么代码将不会那么混乱。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56550384
复制相关文章
相似问题
腾讯云开发者
