如何将javascript值存储到mysql数据库中?

时间:2017-03-08 20:01:38

标签: javascript php mysql

我正在尝试将用户的BMI分数和评论存储到mysql数据库中。我能够存储他们的身高和体重,但不是他们的得分和bmi评论。 任何建议,将不胜感激。

<script type="text/javascript">
    function Calculate()
    {
        //Obtain user inputs
        var height=Number(document.getElementById("height").value);
        var heightunits=document.getElementById("heightunits").value;
        var weight=Number(document.getElementById("weight").value);
        var weightunits=document.getElementById("weightunits").value;


       //Convert all units to metric
       if (heightunits=="inches") height/=39.3700787;
       if (weightunits=="lb") weight/=2.20462;
       if (heightunits=="cm") height/=100;

      //Perform calculation
      var BMI=weight/Math.pow(height,2);

      //Display result of calculation
      document.getElementById("output").innerText=Math.round(BMI*100)/100;

      var output =  Math.round(BMI*100)/100
       if (output<18.5)
       document.getElementById("comment").innerText = "Underweight";
       else   if (output>=18.5 && output<=25)
       document.getElementById("comment").innerText = "Normal";
       else   if (output>=25 && output<=30)
       document.getElementById("comment").innerText = "Obese";
       else   if (output>30)
       document.getElementById("comment").innerText = "Overweight";
      // document.getElementById("answer").value = output; 
    }
</script>
 </head>
 <body>

<div>BMI Calculator</div>

<input type="button" value="Calculate" onclick="Calculate(this.form);">
<input type="submit" name="savebmi" value="SaveBMI">

<p class="font-3">Your BMI is: <span name="output" value="output" type="float"     id="output" class="textInput"></span></p>

<p class="font-3">This means you are: <span name="comment" type="text"     id="comment"></span> </p>

3 个答案:

答案 0 :(得分:0)

id output comment 的元素不是input元素,而是span,因此它们不会传递给PHP脚本。 您应该尝试通过AJAX将其传递给您的脚本,然后您可以将这些值添加到请求中。 例如:

var req = new XMLHttpRequest();
req.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        // Whatever you want to do with the php response
    }
}
req.open("POST", "script.php", true);
req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
req.send("output=" + output + "&weight=" + weight + ...);

另一种解决方法是使用隐藏的input元素,但是您应该创建一个函数来验证这些元素或使其不可编辑。

答案 1 :(得分:0)

您可以做的一件事是将span代码更改为input代码,然后只需更改JavaScript即可设置value属性而不是innerText。然后,当您提交表单时,它会将这些值传递给您的PHP脚本。

如果不喜欢框的外观,您可以随时设置输入框的样式以匹配段落文本。例如,从style='border:none开始。

的JavaScript

  //Display result of calculation
  document.getElementById("output").value=Math.round(BMI*100)/100;

  var output =  Math.round(BMI*100)/100
   if (output<18.5)
   document.getElementById("comment").value = "Underweight";
   else   if (output>=18.5 && output<=25)
   document.getElementById("comment").value = "Normal";
   else   if (output>=25 && output<=30)
   document.getElementById("comment").value = "Obese";
   else   if (output>30)
   document.getElementById("comment").value = "Overweight";
  // document.getElementById("answer").value = output; 

HTML

<p class="font-3">Your BMI is: <input name="output" type="float" id="output" class="textInput" style="border:none" /></p>

<p class="font-3">This means you are: <input name="comment" type="text" id="comment" style="border:none" /></p>

答案 2 :(得分:0)

这是一个适合您的问题的解决方案..

//Display result of calculation
var bmi_result = Math.round(BMI*100)/100;

document.getElementById("output").innerText=bmi_result;
document.getElementById("form_output").innerText=bmi_result;

var comment = '';
if (bmi_result<18.5) {
   comment  = "Underweight";
} else   if (bmi_result>=18.5 && output<=25) {
   comment  = "Normal";
} else   if (bmi_result>=25 && output<=30) {
   comment  = "Obese";
} else   if (bmi_result>30) {
   comment  = "Overweight";
}

document.getElementById("comment").innerText = comment;
document.getElementById("form_comment").innerText = comment;

以您的形式:

<input type="hidden" id="form_output" name="output" value="">
<input type="hidden" id="form_comment" name="comment" value="">
<input type="button" value="Calculate" onclick="Calculate(this.form);">