使用Javascript - 現在雖然

switch語句現在的工作，好樣的工作，其他的問題，驗證表單數據。感謝所有的建議。不過，我有兩個問題。使用Javascript - 現在雖然

1）如果我的課程和部分不匹配，我得到了驗證消息告訴我，我的部分是無效的（太棒了！），但單擊確定後，它仍然前進到確認消息，並然後是表單處理器頁面。有關如何防止這種情況的任何建議？

2）在確認信息，如果我點擊取消，我得到我的登記已被取消（太棒了！）正確的消息，但它仍然進入的形式處理器頁......告訴我，我的形式已提交。有關如何防止這種情況的任何建議？

我原來的郵件仍貼在下面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<!--Document Head--> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
<!--Title Element--> 
<title>Greendale Community College</title> 
<!--Style Element--> 
<style type="text/css"> 
    body { 
     background-color: white; 
    } 

    h1 { 
     text-align: center; 
     font-family: Impact; 
     color: green; 
    } 

    p { 
     font-size: 72px; 
     color: green; 
    } 
</style> 
<!--Script Element--> 
<script type="text/javascript"> 
    /* <![CDATA[ */ 
    // function to validate and create message confirm box 
    function submitRegistration() { 
     var fName = document.registration.firstName.value; 
     var lName = document.registration.lastName.value; 
     var cwid = document.registration.cwid.value; 
     var semester = document.registration.semester.value; 
     var course = document.registration.courses.value; 
     var section = document.registration.section.value; 
     var major = document.registration.needForMajor.value; 
     var semesterDisplay; 
     // To display semester info in confirm message 
     if (semester == "fall") 
      semesterDisplay = "Fall"; 
     if (semester == "spring") 
      semesterDisplay = "Spring"; 
     if (semester == "summer") 
      semesterDisplay = "Summer"; 
     //To display major requirement in confirm message 
     var checkDisplay; 
     if (document.registration.needForMajor.checked == true) { 
      checkDisplay = "Course Needed For Major"; 
     } 
     else { 
      checkDisplay = ""; 
     } 
     //Validates first name 
     if (fName == "") { 
      window.alert("You must enter your first name!"); 
      return false; 
     } 
     //Validates that first name is non-numeric 
     if (isNaN(fName) == false) { 
      window.alert("Your First Name must be non-numeric values!"); 
      return false; 
     } 
     //Validates last name 
     if (lName == "") { 
      window.alert("You must enter your last name!"); 
      return false; 
     } 
     //Validates that last name is non-numeric 
     if (isNaN(lName) == false) { 
      window.alert("Your Last Name must be non-numeric values!"); 
      return false; 
     } 
     //Validates CWID 
     if (cwid == "") { 
      window.alert("You must enter your cwid!"); 
      return false; 
     } 
     //Validates that CWID is numeric 
     if (isNaN(cwid) == true) { 
      window.alert("Your CWID must be numeric values!"); 
      return false; 
     } 
     //Validates semester 
     var validateSemester = false; 
     for (var i = 0; i < 3; ++i) { 
      if (document.registration.semester[i].checked == true) { 
       validateSemester = true; 
       break; 
      } 
     } 
     if (validateSemester != true) { 
      window.alert("You must select a Semester!"); 
      return false; 
     } 
     //Validates course 
     if (course == "") { 
      window.alert("You must select a Course!"); 
      return false; 
     } 
     // Validates that the course and section are compatible 
     var error = true; 
     switch (course) { 
      case "CIS 100": 
       if (section == '100001') { 
       } else if (section == '100gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 100!"); 
        error = false; 
       } 
       break; 
      case "CIS 120": 
       if (section == '120001') { 
       } else if (section == '120gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 120!"); 
        error = false; 
       } 
       break; 
      case "CIS 220": 
       if (section == '220001') { 
       } else if (section == '220gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 220!"); 
        error = false; 
       } 
       break; 
      case "CIS 299": 
       if (section == '299001') { 
       } else if (section == '299gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 299!"); 
        error = false; 
       } 
       break; 
      case "CIS 302": 
       if (section == '302gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 302!"); 
        error = false; 
       } 
       break; 
      case "CIS 304": 
       if (section == '304001') { 
       } else if (section == '304gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 304!"); 
        error = false; 
       } 
       break; 
      case "CIS 321": 
       if (section == '321001') { 
       } else if (section == '321gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 321!"); 
        error = false; 
       } 
       break; 
      case "CIS 322": 
       if (section == '322gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 322!"); 
        error = false; 
       } 
       break; 
      case "CIS 325": 
       if (section == '325gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 325!"); 
        error = false; 
       } 
       break; 
      case "CIS 330": 
       if (section == '330001') { 
       } else if (section == '330gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 330!"); 
        error = false; 
       } 
       break; 
      case "CIS 332": 
       if (section == '332001') { 
       } else if (section == '332gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 332!"); 
        error = false; 
       } 
       break; 
      case "CIS 341": 
       if (section == '341001') { 
       } else if (section == '341gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 341!"); 
        error = false; 
       } 
       break; 
      case "CIS 343": 
       if (section == '34301a') { 
       } else if (section == '34301b') { 
       } else { 
        window.alert("You must select a valid section for CIS 343!"); 
        error = false; 
       } 
       break; 
      case "CIS 352": 
       if (section == '352gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 352!"); 
        error = false; 
       } 
       break; 
      case "CIS 354": 
       if (section == '354001') { 
       } else if (section == '354gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 354!"); 
        error = false; 
       } 
       break; 
      case "CIS 401": 
       if (section == '401gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 401!"); 
        error = false; 
       } 
       break; 
      case "CIS 419": 
       if (section == '419x01') { 
       } else { 
        window.alert("You must select a valid section for CIS 419!"); 
        error = false; 
       } 
       break; 
      case "CIS 490": 
       if (section == '490001') { 
       } else if (section == '490gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 490!"); 
        error = false; 
       } 
       break; 
      case "CIS 492": 
       if (section == '492gw1') { 
       } else { 
        window.alert("You must select a valid section for CIS 492!"); 
        error = false; 
       } 
       break; 
      case "MAT 195": 
       if (section == '195001') { 
       } else if (section == '195w01') { 
       } else { 
        window.alert("You must select a valid section for MAT 195!"); 
        error = false; 
       } 
       break; 
      case "MAT 215": 
       if (section == '215001') { 
       } else if (section == '215w01') { 
       } else { 
        window.alert("You must select a valid section for MAT 215!"); 
        error = false; 
       } 
       break; 
      case "MAT 225": 
       if (section == '225001') { 
       } else if (section == '225w01') { 
       } else { 
        window.alert("You must select a valid section for MAT 225!"); 
        error = false; 
       } 
       break; 
      case "MAT 281": 
       if (section == '281001') { 
       } else if (section == '281w01') { 
       } else { 
        window.alert("You must select a valid section for MAT 281!"); 
        error = false; 
       } 
     } 

     //Validates section 
     if (section == "") { 
      window.alert("You must select a Section!"); 
      return false; 
     } 
     //Confirm message 
     var confirmation = window.confirm("Student Name: " + fName + " " + lName + " CWID: " + cwid + " Semester: " + semesterDisplay + " Course: " + course + " Section: " + section + " " + checkDisplay); 
     //Ok and Cancel buttons 
     if (confirmation) { 
      window.alert("You have been registered for your course!"); 
     } 
     else { 
      window.alert("Your registration has been canceled."); 
     } 
    } 
    //Reset function 
    function resetRegistration() { 
     var resetForm = window.confirm("Are you sure you want to reset the form?"); 
     if (resetForm == true) 
      return true; 
     return false; 
    } 
    //Functions for mouseover and mouseout 
    function mouseOver(target) { 
     target.src = 'greendale_paper.png' 
     target.alt = 'paper' 
    } 

    function mouseOut(target) { 
     target.src = 'greendale.jpg' 
     target.alt = 'greendale' 
    } 
    /* ]]> */ 
</script> 
</head> 
<body> 
<!--Heading Element--> 
    <h1>Greendale Community College</h1> 
     <!--Added a mouseover and mouseout--> 
     <center><img src="greendale.jpg" alt="greendale" width="560" height="315" 
      onmouseover="mouseOver(this)" 
      onmouseout="mouseOut(this)" 
     /></center> 
    <h3 align="center">Greendale Community College Orientation Video</h3> 
    <center><iframe width="560" height="315" src="https://www.youtube.com/embed/i3z5QO2O3cU" frameborder="0"></iframe></center> 
    <h2 align="center">Course Registration Page</h2> 
<form action="FormProcessor.html" name="registration" method="get" 
     onsubmit="return submitRegistration()" 
     onreset="return resetRegistration()"> 
    <h3>Student Information Form</h3> 
    <!--Student Information--> 
    First Name:<input type="text" name="firstName"/><br /> 
    Last Name:<input type="text" name="lastName"/><br /> 
    CWID:<input type="text" name="cwid" size="8" /><br /> 
    <h3>Semester</h3> 
    <h4>(choose a semester)</h4> 
    <!--Radio Buttons to Choose Semester--> 
    <input type="radio" name="semester" value="fall" /> Fall 2018 <br /> 
    <input type="radio" name="semester" value="spring" /> Spring 2018 <br /> 
    <input type="radio" name="semester" value="summer" /> Summer 2018 <br /> 
    <h3>Courses</h3> 
    <h4>(choose one course)</h4> 
    <table> 
     <!--Drop Down Box for Courses--> 
     <tr><td style="background:white;border:0">Courses:</td> 
      <td> 
       <select name="courses" size="1"> 
        <option value=""></option> 
        <option value="CIS 100">CIS 100 Intro to CIS</option> 
        <option value="CIS 120">CIS 120 Application Prog I</option> 
        <option value="CIS 220">CIS 220 Application Prog II</option> 
        <option value="CIS 299">CIS 299 System Analysis I</option> 
        <option value="CIS 302">CIS 302 Visual Programming</option> 
        <option value="CIS 304">CIS 304 Cobol</option> 
        <option value="CIS 321">CIS 321 DB Mgt Sys and Design</option> 
        <option value="CIS 322">CIS 322 DB App Development</option> 
        <option value="CIS 325">CIS 225 Dec Support Systems</option> 
        <option value="CIS 330">CIS 330 Web Programming I</option> 
        <option value="CIS 332">CIS 332 Web Programming II</option> 
        <option value="CIS 341">CIS 341 CISCO CCNA I</option> 
        <option value="CIS 343">CIS 343 CISCO CCNA III</option> 
        <option value="CIS 352">CIS 352 Global Ethics in Comp</option> 
        <option value="CIS 354">CIS 354 Sys Project Mgt</option> 
        <option value="CIS 401">CIS 401 Concepts Enter Res Planning</option> 
        <option value="CIS 419">CIS 419 CIS Internship</option> 
        <option value="CIS 490">CIS 490 Systems Analysis II</option> 
        <option value="CIS 492">CIS 492 Systems Dev and Imp</option> 
        <option value="MAT 195">MAT 195 Discrete Math Structures</option> 
        <option value="MAT 215">MAT 215 Statistics</option> 
        <option value="MAT 225">MAT 225 Business Statistics</option> 
        <option value="MAT 281">MAT 281 Calculus I</option> 
       </select> 
      </td> 
     </tr> 
    </table> 
    <h3>Sections</h3> 
    <h4>(choose one section)</h4> 
    <table> 
     <tr><td style="background:white;border:0">Section Numbers:</td> 
      <td> 
       <!--Selection Box--> 
       <select name="section" multiple="multiple" size="5"> 
        <option value=""></option> 
        <option value="100001">CIS 100 001</option> 
        <option value="100gw1">CIS 100 GW1</option> 
        <option value="120001">CIS 120 001</option> 
        <option value="120gw1">CIS 120 GW1</option> 
        <option value="220001">CIS 220 001</option> 
        <option value="220gw1">CIS 220 GW1</option> 
        <option value="299001">CIS 299 001</option> 
        <option value="299gw1">CIS 299 GW1</option> 
        <option value="302gw1">CIS 302 GW1</option> 
        <option value="304001">CIS 304 001</option> 
        <option value="304gw1">CIS 304 GW1</option> 
        <option value="321001">CIS 321 001</option> 
        <option value="321gw1">CIS 321 GW1</option> 
        <option value="322gw1">CIS 322 GW1</option> 
        <option value="325gw1">CIS 325 GW1</option> 
        <option value="330001">CIS 330 001</option> 
        <option value="330gw1">CIS 330 GW1</option> 
        <option value="332001">CIS 332 001</option> 
        <option value="332gw1">CIS 332 GW1</option> 
        <option value="341001">CIS 341 001</option> 
        <option value="341gw1">CIS 341 GW1</option> 
        <option value="34301a">CIS 343 01A</option> 
        <option value="34301b">CIS 343 01B</option> 
        <option value="352gw1">CIS 352 GW1</option> 
        <option value="354001">CIS 354 001</option> 
        <option value="354gw1">CIS 354 GW1</option> 
        <option value="401gw1">CIS 401 GW1</option> 
        <option value="419x01">CIS 419 X01</option> 
        <option value="490001">CIS 490 001</option> 
        <option value="490gw1">CIS 490 GW1</option> 
        <option value="492gw1">CIS 492 GW1</option> 
        <option value="195001">MAT 195 001</option> 
        <option value="195w01">MAT 195 W01</option> 
        <option value="215001">MAT 215 001</option> 
        <option value="215w01">MAT 215 W01</option> 
        <option value="225001">MAT 225 001</option> 
        <option value="225w01">MAT 225 W01</option> 
        <option value="281001">MAT 281 001</option> 
        <option value="281w01">MAT 281 W01</option> 
       </select> 
       </td> 
      </tr> 
    </table> 
    <!--Checkbox--> 
    <input type="checkbox" name="needForMajor" /> 
    Check if the course is required for your major!<br /> 
    <!--Submit and Reset Buttons Created--> 
    <input type="submit" name="submit" value="Submit"/><br /> 
    <input type="reset" name="reset" value="Reset"/> 
    </form> 
    </body> 
</html>

我的問題是關於與的JavaScript驗證表單數據。我有一大堆的驗證代碼，因爲它返回false這偉大工程。我，但是，嘗試使用switch語句來驗證我的形式，但我在努力，因爲它返回true：一旦函數返回true，我的代碼的其餘部分執行，而不是通過我的驗證的其餘部分運行。我認爲break語句可以防止這種情況，但事實並非如此。 switch語句是否是錯誤的方法？有沒有辦法做switch語句而不做「return true」？建議表示讚賞。如果您需要查看更多我的代碼，請告訴我。我不希望別人認爲我是在要求他們爲我完成我的任務。

來源

2017-07-27 Bob

請更新您發佈的代碼爲1 ）正確的是你沒有顯示你的'switch'的完整代碼，2）顯示'switch'所在的函數以及3）所有相關的HTML和CSS。 –

調用'return'將立即退出該功能。什麼'打破'是防止其他交換機案件被測試。 –

我認爲break語句可以防止這種情況，但事實並非如此。

break語句從未達到。 return語句導致函數立即返回。

聽起來好像您正在嘗試測試多個事物，並且如果它們中的任何一個失敗，則返回false。

因此，創建一個默認爲true的變量。

如果測試成功，什麼也不做
如果測試不正常，該變量設置爲false

例如：

var nothing_is_wrong = true;

過程中你的測試

然後

switch (course) { 
    case "CIS 100": 
    if (section == '100001') { 
     // It's fine! Do nothing 
    } else if (section == '100gw1') { 
     // It's fine! Do nothing 
    } else { 
     window.alert("You must select a valid section for CIS 100!"); 
     // It's not fine! :(
     nothing_is_wrong = false; 
    } 
    break;

然後，最後，r eturn那個變量

return nothing_is_wrong;

來源

2017-07-27 15:46:35 Quentin

是的，但如果你不打算在前兩個「if」分支中做任何事情，不要爲他們測試。將他們相反的測試結合到單個測試中，並且如果無效測試爲真則設置「假」標誌。 –

另外，在你的'else'中，你應該有'nothing_is_wrong = false'，因爲這是確定* something *錯誤的部分。 –

你可以試試這個方法，我已經添加了一些假設代碼。這裏return狀態導致你的主要問題。它阻止執行break聲明。

var wrong; 
switch (course) { 
    case "CIS 100": 
    if (section == '100001') 
     wrong = false; 
    else if (section == '100gw1') 
     wrong = false; 
    else 
     window.alert("You must select a valid section for CIS 100!"); 
     wrong = true ; 
    break; 

case "CIS 200": 
    if (section == '200002') 
     wrong = false; 
    else if (section == '100gw1') 
     wrong = false; 
    else 
     window.alert("You must select a valid section for CIS 100!"); 
     wrong = false ; 
default: 
     wrong = true ; 
} 

return wrong ;

來源

2017-07-27 15:51:23

您不應該在這裏使用return。所有你需要做的就是設置一個驗證失敗的「標誌」，然後檢查標誌。

此外，談到驗證時，您只需要測試無效數據，並且只有當您擁有該時才停止提交。如果數據是好的，不要做任何事情，只要讓過程正常發生。

這裏的形式如何提交事件處理程序看起來一個例子：

formReference.addEventListener("submit", function(evt){ 
    var valid = true; 
    var message = ""; 

    // Switch is best when there is a single value that you want to look at 
    // if is best when there are different tests to perform 

    // If course is good, but section is bad... 
    if (course === "CIS 100" && (section !== '100001' && section !== '100gw1')){ 
    message = "You must select a valid section for CIS 100!"; 
    valid = false; 
    } else if(// Next test for invalid value here) { 
    message = "next message"; 
    valid = false; 
    } 

    // After doing the tests, just check the flag 
    if(!valid){ 
    // Error! Show message 
    alert(message); 

    // Cancel the form submission 
    evt.preventDefault(); 
    evt.stopPropagation(); 
    } 
});

來源

2017-07-27 15:52:59

'section！=='100001'||部分！=='100gw1''將始終評估爲true;你需要'&&' ;） –

@ChrisG是的，你是對的。答案已更新。 –

謝謝....我通過建議和工作。我真的很陌生（網絡編程我），並試圖提出相關的有針對性的問題。你的幫助是真正的讚賞。 – Bob

你可以用你的方法，無需額外的變量，就像這樣：

function validate() { 
    switch (course) { 
    case "CIS 100": 
     switch (section) { 
     case '100001': 
     case '100gw1': 
      break; 
     default: 
      alert("You must select a valid section for CIS 100!"); 
      return false; 
     } 
     break; 
    case "CIS 200": 
     switch (section) { 
     case '200001': 
     case '200gw1': 
      break; 
     default: 
      alert("You must select a valid section for CIS 200!"); 
      return false; 
     } 
     break; 
    } 
    // rest of validation 
    return true; 
}

來源

2017-07-27 16:01:08

在相關說明上;如果這些選項是'

使用Javascript - 現在雖然

回答