如何在javascript中获取Contact Form 7字段值？

Question

[请帮助我，我已经完成了所有的JavaScript工作。仅最后一部分是非常困难的。我已经使用了用于联系form7的计算器插件来计算BMI，这非常有效。隐藏BMIhigh文本也可以，然后单击

Length (cm):
<label id="centi">[number* cm min:130 max: 220]</label>

Hight (kilo):
<label id="kilo">[number* kilo min:40 max:140]</label>

<label id="calcbutton">[calculate_button "calculate"]</label>

<label id="calc">[calculation calculate precision:1 "kilo / ((cm / 100) * (cm / 100))"]</label> 
<label id="BMIhigh"> 
Your BMI is too high
</label>
[submit "Send"]

在底部，我有以下代码：

// Hide the BMIhigh text field by default
document.getElementById("BMIhigh").style.display = 'none';
// On every 'click' on the calculator call the displayTextField function
document.getElementById("calcbutton").addEventListener("click", displayTextField);
  function displayTextField() {
    // Get the inserted values for centi and kilo and calculate the BMI again 
    // for the function without the help of the calculator build in into the extra plugin.
   var centimeter = +document.getElementById("centi").value;
   var kilogram = +document.getElementById("kilo").value;
   var BMIvar = kilogram / ( ( centimeter / 100 ) * ( centimeter / 100 ) );
    // If BMIvar higher than 30 it is too high, the text should show. 
    // THIS LAST PART DOES NOT WORK
    if(BMIvar > 30) {
     document.getElementById("BMIhigh").style.display = 'block';
    } else {
      document.getElementById("BMIhigh").style.display = 'none';
    }
  }
</script> ```

Answer 1

您的变量BMIvar永远不会得到评估，因为，

var centimeter = +document.getElementById("centi").value;
var kilogram = +document.getElementById("kilo").value;

这些变量未正确填充。 CF7将字段标签转换为<span>封装的<input/>字段，

<label id="centi">
  <span class="wpcf7-form-control-wrap cm">
    <input type="number" name="cm" value="" class="wpcf7-form-control wpcf7-number wpcf7-validates-as-required">
  </span>
</label>

因此getElementById返回<label/>元素，而不返回<input/>一个元素。 element.value仅适用于<input/>字段。尝试改用getElementByName并将上面的两行替换为，

var centimeter = +document.getElementByName("cm")[0].value;
var kilogram = +document.getElementByName("kilo")[0].value;