Question

我在尝试弄清楚如何将我的bmi计算器从幻灯片更改为选择框然后传递该输入以使其计算时遇到问题。

对于脚，我将英寸设置为值，然后选择英寸时，需要将它们添加到脚上以获得总数。

    <div class="form-group">
        <label for="height-ft">Feet</label>
        <select name="height-ft" id="height-ft" class="form-control">
            <option value="12">1'</option>
            <option value="24">2'</option>
            <option value="36">3'</option>
            <option value="48">4'</option>
            <option value="60">5'</option>
            <option value="72">6'</option>
            <option value="84">7'</option>
        </select>
    </div>

    <div class="form-group">
        <label for="height-in">Inches</label>
        <select name="height-in" id="height-in" class="form-control">
            <option value="1">1"</option>
            <option value="2">2"</option>
            <option value="3">3"</option>
            <option value="4">4"</option>
            <option value="5">5"</option>
            <option value="6">6"</option>
            <option value="7">7"</option>
            <option value="8">7"</option>
            <option value="9">9"</option>
            <option value="10">7"</option>
            <option value="11">7"</option>
        </select>   
    </div>

JS小提琴： 使用jquery ui幻灯片的工作示例。 http://jsfiddle.net/ypyxrks8/

任何有关转换此内容的帮助都将非常感激。

Answer 1

如果您正在寻求帮助，请将英寸添加到英尺，然后将此行代码添加到计算按钮中：

   var total = parseInt($('#height-ft').val()) +  parseInt($('#height-in').val());

这会给你总英寸数。

Answer 2

你基本上拥有它。该滑块正在做一些东西来获取值，但您可以使用parseInt（）获取值。我必须添加转换因子才能使其正确，并且您需要填写离散的重量值，但这里是代码：

[HTML]

<div class="container">
<div class="row">
    <div class="col-md-12"> <strong>Height:</strong>

        <div class="form-group">
            <select name="height-ft" id="height-ft" class="form-control">
                <option value="12">1'</option>
                <option value="24">2'</option>
                <option value="36">3'</option>
                <option value="48">4'</option>
                <option value="60">5'</option>
                <option value="72">6'</option>
                <option value="84">7'</option>
            </select>
        </div>
        <div class="form-group">
            <select name="height-in" id="height-in" class="form-control">
                <option value="1">1"</option>
                <option value="2">2"</option>
                <option value="3">3"</option>
                <option value="4">4"</option>
                <option value="5">5"</option>
                <option value="6">6"</option>
                <option value="7">7"</option>
                <option value="8">7"</option>
                <option value="9">9"</option>
                <option value="10">10"</option>
                <option value="11">11"</option>
            </select>
        </div>
    </div>
    <div class="col-md-12"> <strong>Weight:</strong>

        <select name="weight-in" id="weight-in" class="form-control">
            <option value="100">100</option>
            <option value="120">120</option>
            <option value="140">140</option>
            <option value="160">160</option>
            <option value="180">180</option>
            <option value="200">200</option>
            <option value="220">220</option>
            <option value="240">240</option>
            <option value="260">260</option>
            <option value="280">280</option>
            <option value="300">300</option>
        </select>
        <br>
    </div>
    <div type="button" id="calculatebutton" class="btn btn-primary">Calculate</div>
    <div id="result"></div>
</div>

[CSS]

/* BMI Calculator */

 $('#calculatebutton').click(function () {
 var weight = parseInt($('#weight-in').val()),
     heightInches = parseInt($('#height-ft').val()) + parseInt($('#height-in').val()),
     heightsqaured = (heightInches) * (heightInches),
     result = ((weight) / (heightsqaured) * 703);
 debugger;
 if (result < 16) {
     var rating = ('You are severely underweight');
 } else if (result > 16 && result < 18.5) {
     var rating = ('You are underweight');
 } else if (result > 18.5 && result < 25) {
     var rating = ('You are healthy');
 } else if (result > 25 && result < 30) {
     var rating = ('You are overweight');
 } else if (result > 30 && result < 35) {
     var rating = ('You are moderately obese');
 } else if (result > 35 && result < 40) {
     var rating = ('You are severely obese');
 } else if (result > 40 && result < 80) {
     var rating = ('You are very severely obese');
 } else if (result > 80) {
     var rating = ('This result seems unlikely, please check that the information you have entered is correct');
 }
 $('#result').html('Your BMI is ' + result.toFixed(1) + '. ' + rating + '.');

}）;

此处的工作版本：https://jsfiddle.net/W3AVE/ypyxrks8/7/

更改滑块以选择框

2 个答案: