Question

我对网页设计非常陌生，我正在努力将javascript变量存储在我的数据库中。

我有一个HTML表单的简单页面，其中包含高度/重量/年龄/性别的文本框，以及一个调用javascript函数的提交按钮，该函数执行一些计算以确定用户是否低于或超重然后返回多少他们应该消耗一天的卡路里才能成为他们BMI的正确体重。

这是javascript：

<script type="text/javascript">

function bmiCalc()
{
    var height=document.getElementById('height box').value,
    weight=document.getElementById('weight box').value;

    weight/=2.2;
    height/=39.37;

    BMI=Math.round(weight/(height*height));
    alert("Your BMI is :"+BMI);
}

function calorieIntake()
{
    var height=document.getElementById('height box').value,
    weight=document.getElementById('weight box').value,
    age=document.getElementById('age box').value,
    gender=document.getElementById('gender box').value;

    if(gender=="male" || gender=="Male")
    {
        if(23<BMI && BMI<25)
        {
            calories=Math.round((66+(6.23*weight)+(12.7*height)-(6*age)));
            alert("You are considered normal weight and should therefore consume: " +calories+" calories a day. This calorie intake will ensure that you remain the same weight");
        }

        else if(BMI<23)

        {
            calories=Math.round((66+(6.23*weight)+(12.7*height)-(6*age)+500));
            alert("You are considered under-weight, and should therefore consume: " +calories+" calories a day. This calorie intake will cause you to gain one pound a week");
        }

        else if(BMI>25)
        {
            calories=Math.round((66+(6.23*weight)+(12.7*height)-(6*age)-500));
            alert("You are considered over-weight and should therefore consume: " +calories+" calories a day. This calorie intake will cause you to lose one pound a week");
        }
    }

    else if(gender=="female" || gender=="Female")
    {
        if(18.49<BMI && BMI<24.9)
        {
            calories=Math.round(655+(4.35*weight)+(4.7*height)-(4.7*age));
            alert("You are considered normal weight and should therefore consume: "+calories+" calories a day. This calorie intake will ensure that you remain the same weight");   
        }

        else if(BMI<18.49)

        {
            calories=Math.round((655+(4.35*weight)+(4.7*height)-(4.7*age)+500));
            alert("You are considered under-weight, and should therefore consume: " +calories+" calories a day. This calorie intake will cause you to gain one pound a week");
        }

        else if(BMI>24.9)
        {   
            calories=Math.round((655+(4.35*weight)+(4.7*height)-(4.7*age)-500));
            alert("You are considered over-weight and should therefore consume: " +calories+" calories a day. This calorie intake will cause you to lose one pound a week");
        }
    }
}

</script>

这是我的表格：

<form>
<p>Enter your height(in inches):</p><input type="text" id="height box">
<p>Enter your weight(in pounds):</p><input type="text" id="weight box">
<p>Enter your age(in years):</p><input type="text" id="age box">
<p>Enter your gender(male/female):</p><input type="text" id="gender box">
<input type="button" value="Your BMI:" id="button1" onClick="bmiCalc()">
</input>
<input type="button" value="Suggested Calorie Intake:" id="button2" onClick="calorieIntake()">
</input>
</form>

我想做的是拿出'calories'变量并将其存储在我的MySQL数据库中。我知道我需要以某种方式将javascript变量传递给php变量，但我不知道如何做到这一点。这样做最简单的方法是什么？

Answer 1

有两种方法可以实现这一目标。

选项1：使用隐藏的表单字段，并在提交表单之前/之前通过JS设置其值。这更容易实现，但会留下一堆安全漏洞。这不应该用于发送敏感数据，但如果输入通过准备好的语句或mysqli_real_escape_string正确消毒，则可以使用它。

选项2：使用AJAX发送数据。 AJAX为您提供了更多选项和数据处理方式。 AJAX可用于发送敏感数据，但您仍需要在服务器端进行清理。

Answer 2

我会考虑使用AJAX。它不是一个库或你必须下载的东西，它只是一种从JavaScript向服务器发送和接收信息的方法。

Answer 3

您需要启动对接受该值并将其存储在数据库中的php页面的AJAX调用。在vanilla javascript中，前半部分看起来像这样：

var xhr = new XMLHttpRequest();
xhr.open("get","/path/to/php/page.php?bmi=calculated_bmi");
xhr.send();

然后您的PHP页面将获取变量（$_GET['bmi']）并将其传递给MySQL。

将javascript变量存储在mysql数据库中

3 个答案: