html - 画像をポップアップして別のサイトにリンクするためのhtmlコード

Question

私はほぼ完了したと思う課題を持っていますが、私の頭はそれ以上のものを与えることはできません。ユーザーデータを収集し、ユーザー情報を検証する html フォームを作成するために呼び出された私の課題。私は正しくやったと思います。今、私はこの指示を理解していませんが、それは検証プロセスの後だと思います」商品アイテムには、Amazon.comまたは他の小売業者のサイトの同じまたは類似のアイテムへのリンクを含めて、潜在的なバイヤーがより良い知識を持つことができるようにする必要があります.新品のアイテムと価格の;" 次に、ユーザーが送信ボタンをクリックした後、サムズアップ画像のポップアップが必要ですが、オンクリックに検証フォームが既にあります。

これが私のコードです：

 <script language="JavaScript" type="text/javascript">

 //Function to validate form

 function validateForm() {

     //Variables are declared

     var s=document.forms["craigslistSalesForm"]["itemName"].value;
     var t=document.forms["craigslistSalesForm"]["itemPrice"].value;
     var u=document.forms["craigslistSalesForm"]["location"].value;
     var v=document.forms["craigslistSalesForm"]["itemCondition"].value;
     var w=document.forms["craigslistSalesForm"]["itemDescription"].value;

     //If itemName is entered continue but if left blank show alert
     if (s==null || s=="") {
     alert("Please enter a title for your posting");
     return false;
     }

     //If itemPrice is entered continue but if left blank show alert
     if (t==null || t=="") {
     alert("Please enter the price of your item");
     return false;
     }

     //If location is entered continue but if left blank show alert
     if (u==null || u=="") {
     alert("Please enter your location");
     return false;
     }

     //If itemCondition is entered continue but if left blank show alert
     if (v==null || v=="Select a condition option") {
     alert("Please choose the condition of your item from the list");
     return false;
     }

     //Variables are declared

     var x=document.forms["craigslistSalesForm"]["email"].value;
     var atpos=x.indexOf("@");
     var dotpos=x.lastIndexOf(".");
     var y=document.forms["craigslistSalesForm"]["email2"].value;

     //If email address doesn't contain symbol @ or . and a minimum 2 characters
     //after dot then alert to correct email address
     if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length) {
     alert("Your email address must be in the format of name@domain.com");
     return false;
     }

     //If second email address does not match first email then alert mis-match
     if (y!=x) {
     alert("Ooops! Your email does not match, please try again.");
     return false;
     }

     //If itemDescription is entered continue but if left blank show alert
     if (w==null || w=="") {
     alert("You must describe your Item for Sale");
     return false;
     }

     }

 </script>

 <html>
 <head>
 <title>Project Task #1 - AGV</title>
 </head>
 <body onload="document.getElementById('itemName').focus()" bgcolor="E1E1E1">
 <form id="craigslistSalesForm">
 <h2>PA Craigslist - Items for sale</h2>
 <div>
 <span>Posting Title:&#160; </span><input tabindex="1" type="text" name="itemName"
 id="itemName" size="35" maxlength="64" value>
 &#160; &#160; <span>Price:&#160; </span>$<input type="text" name="itemPrice"
 id="itemPrice" size="6" maxlength="9" value>
 </div>
 <br>
 <div>
 <span>Location:&#160; &#160; </span><input type="text" name="location"
 id="location" size="35" maxlength="64" value>
 &#160; &#160; &#160; <span>Item condition:&#160; </span>
                 <select id="itemCondition" value>
                 <option>Select a condition option</option>
                 <option>New</option>
                 <option>Like new (in original packaging)</option>
                 <option>Like new (without original packaging
 </option>
                 <option>Fairly used</option>
                 <option>Used</option>
                 <option>Rough condition</option>
                 <option>Working</option>
                 <option>Not working</option>
                 <option>I don't know</option>
                 </select>
 </div>
 <div>
 &#160; &#160; &#160; &#160; &#160; &#160; &#160; &#160; &#160; &#160; &#160;
 &#160;
 <input type="radio" value="Residential" name="typeOfLocation" CHECKED>Residential
 &#160; &#160; <input type="radio" value="Business" name="typeOfLocation">Business
 </div>
 <br>
 <div>
 <span>Your email:&#160; </span><input type="text" name="email" id="email"
 size="35" maxlength="64" value>
 &#160; &#160; <span><i>Retype your email:&#160; </i></span><input type="text"
 name="email2" id="email2" size="35" maxlength="64" value>
 </div>
 <br>
 <div>
 <span><b>Item Description:</b></span>
 <br>
 <textarea cols="80" name="itemDescription" id="itemDescription" style="width: 70%;
 border: 3px solid black; font-family: Calibri; font-size: 24px;" rows="10"></textarea>
 </div>
 <button type="button" value="callTwoFunctions" onclick="validateForm()">
 <b>Submit</b></button>
 </form>
 </body>
 </html>

score 0 · Accepted Answer

スクリプトでは、実行するすべての検証の下に追加のエントリを含めることができます。これは、検証の成功結果として受け入れられます。

function validateForm() {

 //Variables are declared

 var s=document.forms["craigslistSalesForm"]["itemName"].value;
 var t=document.forms["craigslistSalesForm"]["itemPrice"].value;
 var u=document.forms["craigslistSalesForm"]["location"].value;
 var v=document.forms["craigslistSalesForm"]["itemCondition"].value;
 var w=document.forms["craigslistSalesForm"]["itemDescription"].value;

 //If itemName is entered continue but if left blank show alert
 if (s==null || s=="") {
 alert("Please enter a title for your posting");
 return false;
 }

 //If itemPrice is entered continue but if left blank show alert
 if (t==null || t=="") {
 alert("Please enter the price of your item");
 return false;
 }

 //If location is entered continue but if left blank show alert
 if (u==null || u=="") {
 alert("Please enter your location");
 return false;
 }

 //If itemCondition is entered continue but if left blank show alert
 if (v==null || v=="Select a condition option") {
 alert("Please choose the condition of your item from the list");
 return false;
 }

 //Variables are declared

 var x=document.forms["craigslistSalesForm"]["email"].value;
 var atpos=x.indexOf("@");
 var dotpos=x.lastIndexOf(".");
 var y=document.forms["craigslistSalesForm"]["email2"].value;

 //If email address doesn't contain symbol @ or . and a minimum 2 characters
 //after dot then alert to correct email address
 if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length) {
 alert("Your email address must be in the format of name@domain.com");
 return false;
 }

 //If second email address does not match first email then alert mis-match
 if (y!=x) {
 alert("Ooops! Your email does not match, please try again.");
 return false;
 }

 //If itemDescription is entered continue but if left blank show alert
 if (w==null || w=="") {
 alert("You must describe your Item for Sale");
 return false;
 }


 // A place to do additional thing after successful validation
 // you can have another function call
 // i.e. popupImageContainer();

 alert("Yahoo validation is successful lets put another function calls instead this alert code");

 }

...また、ボタンタグのイベントのvalidateForm()関数の後に呼び出しを追加することで、何かをポップアップする他の関数を持つことができます:onclick

`<button type="button" value="callTwoFunctions" onclick="validateForm();popupDialog();">`

html - 画像をポップアップして別のサイトにリンクするためのhtmlコード

1 に答える 1

Related

Reference