0
我的JSfiddle使其變得簡單 - 編輯: 只需要幫助我的等式在標籤3中工作,現在,其他所有的工作!jquery單選按鈕,另外還有兩個其他小問題
最後,最後一個問題是我的公式我做了不正常的BMI(TAB3)。 BMI結果幾乎總是在15到40之間出現。我嘗試了幾種不同的寫作方式,但無濟於事,它從來沒有提出任何接近15-40的東西。只是好奇,我可以重寫那個工作。
謝謝您的時間和耐心,在此非常感謝! HTML:
<h2>Health Calculator</h2>
<!-- tabs setup for page -->
<div id="tabs">
<ul>
<li>
<a href="#tabs-1">First</a>
</li>
<li>
<a href="#tabs-2">Second</a>
</li>
<li>
<a href="#tabs-3">Third</a>
</li>
</ul>
<div id="tabs-1">
<p><strong>Exercise</strong></p>
<!-- Form for Tab one -->
<form>
<p><strong>Activity factor</strong></p>
<!-- Setup Radio buttons -->
<p>
<input type="radio" name="activity" id="sed" value="1.2"/>
<label for="sed" id="sedLabel">Sedentary = BMR X 1.2 (little or no exercise, desk job)</label>
</p>
<p>
<input type="radio" name="activity" id="lit" value="1.375"/>
<label for="lit" id="litLabel">Lightly active = BMR X 1.375 (light exercise/sports 1-3 days/wk)</label>
</p>
<p>
<input type="radio" name="activity" id="mod" value="1.55"/>
<label for="mod" id="modLabel">Mod. active = BMR X 1.55 (moderate exercise/sports 3-5 days/wk)</label>
</p>
<p>
<input type="radio" name="activity" id="very" value="1.725"/>
<label for="very" id="veryLabel">Very active = BMR X 1.725 (hard exercise/sports 6-7 days/wk)</label>
</p>
<p>
<input type="radio" name="activity" id="ext" value="1.9"/>
<label for="ext" id="extLabel">Extr. Active = BMR X 1.9 (hard daily exercise/sports & physical job or 2 X day training, marathon, football camp, contest, etc.)</label>
</p>
</form>
</div>
<div id="tabs-2">
<!-- Div and form setup for tab 2 -->
<p>Diet - Caloric maintenance</p>
<!-- The equation is shown for reference -->
<p>Men: Base result = 66 + (13.7 X wt in kg) + (5 X ht in cm) - (6.8 X age in years)</p>
<p>The base result is then modified by the previously selected activity level to give you your average daily calorie expenditure</p>
<!--Form for weight, height, and age of Caloric Maintenance calc.-->
<!-- Form to all text entry for values -->
<form>
<label for="txtWeight">Weight:</label>
<input type="text" class="txtInput" id="txtWeight" value="0"/>
<label for="txtHeight">Height:</label>
<input type="text" class="txtInput" id="txtHeight" value="0"/>
<label for="txtAge">Age:</label>
<input type="text" class="txtInput" id="txtAge" value="0"/>
<br/>
<input type="button" id="btnCalc1" value="Calculate"/>
<p id="result">Result</p>
</form>
<p>------------------------------------------</p>
<!-- This is a conversion section since the above mention equation uses metric system-->
<br/>
<form>
<label for="txtWeight">Lbs to Kg::</label>
<input type="text" class="txtInput" id="txtLbs" value="0"/>
<br/>
<input type="button" id="btnCalc2" value="Calculate"/>
<p id="result2">Result</p>
<label for="txtHeight">Inches to Cm:</label>
<input type="text" class="txtInput" id="txtInch" value="0"/>
<br/>
<input type="button" id="btnCalc3" value="Calculate"/>
<p id="result3">Result</p>
</form>
</div>
<!-- Div and form setup for Tab 3 -->
<div id="tabs-3">
<p>BMI Calculator</p>
<!-- The equation is shown for reference -->
<p>BMI = (Mass (lb)/height(in)^2) * 703</p>
<!-- Form to all text entry for values -->
<form>
<label for="txtMass">Mass in Lbs:</label>
<input type="text" class="txtInput" id="txtMass" value="0"/>
<label for="txtHinch">Height in Inches:</label>
<input type="text" class="txtInput" id="txtInput" value="0"/>
<br/>
<input type="button" id="btnCalc4" value="Calculate"/>
<p id="result4">Result</p>
</form>
</div>
</div>
</body>
的Javascript:
// JavaScript Document
$(function() {
$('#tabs').tabs();
});
// Tab 2
$(function() {
//Identify Variables
var txtWeight, txtHeight, txtAge;
// attach event listener to the toggle button's click event
$('#btnCalc1').click(function() {
var result = 66 + (13.7 * $('#txtWeight').val()) + (5 * $('#txtHeight').val()) - (6.8 * $('#txtAge').val());
var activity = $('input[name="activity"]:checked').val() || 0;
$('#result').html('Result: '+activity * result)
});
});
// Still Tab 2, but second half
$(function() {
//Identify Variables
var txtInch, txtLbs;
// attach event listener to the toggle button's click event
$('#btnCalc2').click(function() {
result2 = $('#txtLbs').val() * 0.45359237;
//Output result
$('#result2').html('Result: '+result2)
});
$('#btnCalc3').click(function() {
result3 = $('#txtInch').val() * 2.54;
//Output result
$('#result3').html('Result: '+result3)
});
});
//Tab 3
$(function() {
//Identify Variables
var txtMass, txtHinch;
// attach event listener to the toggle button's click event
$('#btnCalc4').click(function() {
result4 = ($('#txtMass').val()/($('#txtHinch') * $('#txtHinch'))) * 703;
$('#result4').html('Result: '+result4)
});
});
http://jsfiddle.net/arunpjohny/s65y96zv/1/ – 2014-10-06 12:27:22
哇,這是一個巨大的幫助。我現在更接近完成這一步,非常感謝你。非常感謝。 – 2014-10-06 12:41:15