3 回答

TA貢獻(xiàn)1812條經(jīng)驗(yàn) 獲得超5個贊
您沒有訪問元素的值。您應(yīng)該更改代碼以包括從 HTML 元素中提取值。像這樣:
var field1 = document.getElementById("englishid").value;
var field2 = document.getElementById("mathid").value;
var field3 = document.getElementById("computerid").value;
將.value提取 HTML 標(biāo)記中的值。
您還可以改進(jìn) if 語句。以下可能不會像您認(rèn)為的那樣做:
if (field1 || field2 || field3 === NULL)
這里實(shí)際發(fā)生了什么,它說的是: Is field1 set (not NULL, undefined, 0, NaN, "" or false) OR is field2 set (not NULL, undefined, 0, NaN, "" or false) OR is field3 NULL.
如果您想檢查其中任何一個是否為空,您需要執(zhí)行以下操作:
if (field1 === NULL || field2 === NULL || field3 === NULL)
甚至更好,更容易:
if (!field1 || !field2 || !field3)
完整功能:
function GradeCal() {
var field1 = document.getElementById("englishid").value;
var field2 = document.getElementById("mathid").value;
var field3 = document.getElementById("computerid").value;
var result;
if (!field1 || !field2 || !field3) {
alert("Please enter number");
} else {
result = (field1 + field2 + field3) / 3;
document.getElementById("markid").innerHTML = +result;
}
}

TA貢獻(xiàn)1802條經(jīng)驗(yàn) 獲得超10個贊
您的字段變量是您需要獲取字段值以檢查元素不能為空的元素
var field1 = document.getElementById("englishid").value;
var field2 = document.getElementById("mathid").value;
var field3 = document.getElementById("computerid").value;

TA貢獻(xiàn)2036條經(jīng)驗(yàn) 獲得超8個贊
GradeCal您可以稍微調(diào)整該函數(shù)并使其更具可擴(kuò)展性,只需使用要處理的字段名稱的數(shù)組和一些基本的數(shù)組方法即可。
function GradeCal(){
let result=[];
let fields=[ 'english', 'math', 'computer' ];
let out=document.getElementById('markid');
fields.forEach( ( id, i )=>{
let field=document.querySelector( 'input[name="'+id+'"]' );
if( field && !isNaN( field.value ) && field.value!='' )result.push( parseFloat( field.value ) );
else alert( 'Please enter a number for '+id )
});
if( result.length === fields.length ) {
out.innerHTML = result.reduce(( a,v )=>{ return a + v } ) / fields.length;
} else {
out.innerHTML='Error';
}
}
function GradeCal(){
let result=[];
let fields=[ 'english', 'math', 'computer' ];
let out=document.getElementById('markid');
fields.forEach( ( id, i )=>{
let field=document.querySelector( 'input[name="'+id+'"]' );
if( field && !isNaN( field.value ) && field.value!='' )result.push( parseFloat( field.value ) );
else alert( 'Please enter a number for '+id )
});
if( result.length === fields.length ) {
out.innerHTML = result.reduce(( a,v )=>{ return a + v } ) / fields.length;
} else {
out.innerHTML='Error';
}
}
<h2>Grade Book Calculator</h2>
<h4> Welcome to Grade Book Calculator </h4>
<form id="my form">
<table>
<tr>
<td>Student ID:</td>
<td> <input id="studentid" value="bc180200783" oninvalid="alert(Please Enter Student ID)" type="text" place holder="Enter your VU ID" required="required" /></td>
</tr>
<tr>
<td>Name:</td>
<td> <input id="nameid" value="Hina" oninvalid="alert(Please Enter Name)" type="text" required="required" /></td>
</tr>
<tr>
<td>Father Name:</td>
<td> <input id="fathernameid" value="Zafar" oninvalid="alert(Please Enter Father Name)" type="text" required="required" /></td>
</tr>
<tr>
<td>CNIC:</td>
<td> <input id="cnicid" pattern="^[0-9+][5]-[0-9+][7]-[0-9][1]$" value="33100-1100321-5" oninvalid="alert(Please Enter CNIC)" required="required" /></td>
</tr>
<tr>
<td>English:</td>
<td> <input id="englishid" oninvalid="alert(Please Enter English Marks)" name="english" required="required" /></td>
</tr>
<tr>
<td>Math:</td>
<td> <input id="mathid" oninvalid="alert(Please Enter Math Marks)" name="math" required="required" /></td>
</tr>
<tr>
<td>Computer:</td>
<td> <input id="computerid" oninvalid="alert(Please Enter Computer Marks)" name="computer" required="required" /></td>
</tr>
<tr>
<td>Average Marks:</td>
<td> <output type="number" id="markid"> </output>
</td>
</tr>
<tr>
<td> <button type="button" onClick="GradeCal()"> Grade Book </button>
<button type="reset"> Reset</button></td>
</tr>
</table>
</form>
添加回答
舉報(bào)