由於我本身有兼職做牆壁彩繪, 常常讓我最困擾的部分就是場地的大小
我該如何知道實際坪數 , 每次都是將幾*幾交給我老婆去計算,
所以我請我老婆乾脆將公式給我, 我來寫一個簡單的坪數計算表單
也跟來此的前端初學者做個分享交流:
公分換算坪數的公式如下:
- 公分×公分=平方公分
- 平方公分÷10000=平方公尺
- 平方公尺×0.3025=坪
所以回歸到上一個主題javascript加減計算的延伸,
先寫好基本的html
<div class="box-1">
<h2>公分換算坪數</h2>
<input type="text" name="plus" class="plus" value="" placeholder="加法" onClick="placeholder=''">*
<input type="text" name="less" class="less" value="" placeholder="加法" onClick="placeholder=''">
<strong>計算的結果
<!-- 換算的三種結果 -->
<span id="span-1"></span>平方公分
<span id="span-2"></span>平方公尺
<span id="span-3"></span>坪數
</strong>
</div>
接下來就是jquery代碼
$('.submit').on('click',function(){
var plus = $('input[name="plus"]').val();
var less = $('input[name="less"]').val();
var square = 10000;
var meter = 0.3025;
//以上為換算基本的條件 將他們轉為自訂義的變數名稱
var tt = plus * less; //公分×公分=平方公分
var dd = tt / square; //平方公分÷10000=平方公尺
var gg = dd * meter; //平方公尺×0.3025=就等於最後結果
var num = $('input[type="text"]').val();
//將所有input[type="text"]轉為變數 檢查用戶是正確輸入
if(isNaN((num)|| num =='' || num.substring(0,0)==0)){ //判斷是否為數字
alert('請輸入正確數字'); //非數字跳訊息警示
return //返回重新輸入
}
if(num == ''''){
alert('請勿放空 =.='); //放空也要提示一下
}
else {
$('#span-1').text(tt); //正確數值即得結果
$('#span-2').text(dd); //正確數值即得結果
$('#span-3').text(Math.round(gg));
//這邊我用Math.round將小數點四捨五入
}
});
以上是一個簡單的公分換算坪數計算方式, 當然只是很基礎的做法,若您有更專業的方式
歡迎不嗇指教! 感恩祝福!
留言列表