2
myFunction1（）が正しく機能するように警告メッセージを受け取ることができません。 'firstname'姓の注文をありがとうと言ってください。注文フォームのJavaScriptのトラブルシューティング
合計では、productselectionの値にquantityselectionの値を掛けてからshippingselectionの値を加算する必要があります。それはまた合計に7％の税金を加えます。私は次のコードを持っています。あなたの名前が入力されていない場合、最初のメッセージが表示されるように警告を受け取ることができます。しかし、名前欄が記入されたときに注文ボタンをクリックすると何も起こりません。助けてください！ありがとう！
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css"> <!-- links stylesheet -->
<h1>JS Order Form</h1> <!-- Heading -->
</head>
<body>
<script src="script.js"> <!--links js -->
</script>
<div align="center">
<form id="myForm">
<fieldset>
<legend>Personal Information:</legend> <!-- first Form with first and last name-->
First Name: <input type="text" id="field1" name="fname"><br><br>
Last Name: <input type="text" id="field2" name="lname"><br>
</fieldset>
</form>
</div>
<br>
<div align="center">
<form id="myForm1"> <!-- form 2-->
<fieldset>
<legend>Order Info:</legend>
<table style="width:100%">
<table align="left"> <!-- Setting table constraints-->
<table border="1">
<tr>
<td>Product</td>
<td>Price</td>
</tr>
<tr>
<td>Widget 1</td> <!-- table contents-->
<td>$5</td>
</tr>
<tr>
<td>Widget 2</td>
<td>$10</td>
</tr>
</table>
<br>
Select a product:<br>
<select id="productselection">
<option value="blank"></option>
<option value="5">Widget 1</option>
<option value="10">Widget 2</option>
</select>
<br>
Select a quantitiy:<br>
<select id="quantityselection">
<option value="blank"></option>
<option value="5">5</option>
<option value="10">10</option>
</select>
<br>
Select a Shipping Method:<br>
<select id="shippingselection">
<option value="blank"></option>
<option value="0">Standard - Free</option>
<option value="10">3 day - $10</option>
<option value="25">Next Day - $25 2</option>
</select>
</div>
</fieldset>
</form>
<div align="center">
<input type="button" onclick="myFunction();myFunction2() ;blankElement('productselection') ;blankElement('shippingselection') ;blankElement('quantityselection');" value="Clear"> <!-- submit and clear buttons-->
<input type="button" onclick="myFunction1() ;Calculate();" value="Order">
</div>
</body>
</html>
function myFunction() {
document.getElementById("myForm").reset();
}
function myFunction2() {
document.getElementById("myForm1").reset();
}
function blankElement(id)
{
var element = document.getElementById(id);
element.value = blank;
}
function myFunction1()
{
var f3 = document.getElementById("productselection");
var field3 = parseInt(f3.options[f3.selectedIndex].value);
var f4 = document.getElementById("quantityselection");
var field4 = parseInt(f4.options[f4.selectedIndex].value);
var f5 = document.getElementById("shippingselection");
var field5 = parseInt(f5.options[f5.selectedIndex].value);
var field1 = document.getElementById("field1").value.trim();
var field1Valid= true;
var field2 = document.getElementById("field2").value.trim(); // checks to see that a value is inputed
var field2Valid= true;
if (field1.length == 0)
{
field1Valid= false;
} // the following checks to see if anything is inputed and returns a true or false/yes or no
if (field2.length == 0)
{
field2Valid= false;
}
var formValid= field1Valid && field2Valid && field3Valid && field4Valid; //true if all fields are valid else false
if(!formValid){
var alertMessage= 'Please fill in the following '; //sets a var alert message if it meets criteria
if(!field1Valid){ alertMessage+= '[First Name] '; }
if(!field2Valid){ alertMessage+= '[Last Name] '; } // adds the following fields to the alert if they did not meet criteria of being full
alert(alertMessage);
return false;
}
else{
var alertMessage= 'Thanks for the order '+ field1+ ' '+ field2+ '. Your total is $' + (field3 * field4 + field5) + '.00.';
alert(alertMessage);
return true; // pushes out alert message by using field1 and field 2 and then multipling field 3 and 4 together to get a total
}
}
これは何ですか？element.value = blank; 'フィールドをリセットしようとすると 'blank'の値は何ですか？' element.value = ''; ' – itzmukeshy7
'field3Valid && field4Valid'スタンドは何ですか？ために？ – Zamboney