利用javascript的jQuery函式庫來編寫簡單的加減乘除,
首先這是基本要有的html標籤元素
<input type="text" name="plus" placeholder="加法" onClick="placeholder=''">
<input type="text" name="less" placeholder="加法" onClick="placeholder=''">
<input type="submit" value="計算" class="submit">
<strong>計算的結果 <span id="span"></span></strong>
接下來就是JQuery 語法
//將計算的方式賦予給submit
<script>
$('.submit').click(function(){
//加法
var plus = $('input[name="plus"]').val();
var less = $('input[name="less"]').val();
//var gg = plus + less; //這樣是錯誤的 22 + 22 會等於 2222 這樣只是顯示字串
var tt = plus*1 + less*1; //必須將兩個數字乘1再相加
var num = $('input[type="text"]').val(); //判斷是否為數字
if(isNaN((num)|| num =='' || num.substring(0,0)==0)){ //判斷是否為數字
alert('請輸入正確數字'); //非數字跳訊息警示
} else {
$('#span').text(tt); //正確數值即得結果
}
});
</script>
減法:只要改成 var tt = plus*1 - less*1;
乘法:只要改成 var tt = plus * less;
除法:只要改成 var tt = plus / less;
若要觀看範例請點擊以下網址！
歡迎追蹤!!
文章標籤
全站熱搜
留言列表
