2012-08-04 71 views
0

我嘗試用例如4個問題進行測驗(多於一個)。每個問題有4個單選按鈕,一個繼續按鈕(input type="submit")。我希望當你點擊繼續按鈕時,你將被重定向到某個頁面(success.html),但只有當所有問題都被正確回答時。當你在問題中出錯時,點擊繼續按鈕它將重新加載測驗頁面。帶4個問題的Javascript測驗。 Radiobuttons +繼續按鈕

我試圖做到這一點:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
    <head> 
    <meta http-equiv="content-type" content="text/html; charset=windows-1250"> 
    <meta name="generator" content="PSPad editor, www.pspad.com"> 
    <title></title> 
    </head> 
    <body> 
    <h3>1. otazka: otazocka</h3> 
    <input type="radio" name="otazka1" value="n" onClick="toggle(this)" /> Yes 
    <input type="radio" name="otazka1" value="n" onClick="toggle(this)" /> No 
    <input type="radio" name="otazka1e" value="y" onClick="toggle(this)" /> spravna 
    <input type="radio" name="otazka1" value="n" onClick="toggle(this)" /> asda 
    <br /> 
    <input type="submit" id="continue" value="Continue" onClick=""/> 

    <script> 
    var continue_button = document.getElementById('continue');    

    function toggle(switchElement) { 
     if (switchElement.value == 'y') 
       continue_button.setAttribute("onClick", "window.location.href='http://www.google.sk'"); 
     else 
       continue_button.setAttribute("onClick", "window.location.href='http://www.facebook.com'");    
    } 
    </script> 
    </body> 
</html> 

但它只能在一個問題上。

我會很樂意提供一些幫助。 謝謝。


感謝您的回答。但是當我選擇單選按鈕並點擊繼續時,它沒有將我重定向到任何頁面。所以我試試這個

<label><input type="radio" name="otazka1" value="n" /> false</label> 
    <label><input type="radio" name="otazka1" value="n" /> false</label> 
    <label><input type="radio" name="otazka1" value="y" /> true</label> 
    <label><input type="radio" name="otazka1" value="n" /> false</label> 
    <input type="submit" id="continue" value="Continue" /> 
<script> 
    var continue_button = document.getElementById('continue'); 
    continue_button.onclick = function(event) { 
     var everything_OK = true; 
     var inputs = document.getElementsByTagName("input"); 
     for (var i=0; i<inputs.length; i++) { 
      if (inputs[i].type != "radio") 
       continue; 
      var should_be = inputs[i].value == "y"; 
      if (inputs[i].checked != should_be) { 
       everything_OK = false; 
       break; 
      } 
     } 
     if (everything_OK) { 
      // this is not a good success-page 
      continue_button.setAttribute("onClick", "window.location.href='succes.html'"); 
     } else { 
      continue_button.setAttribute("onClick", "window.location.href='pop.html'"); 
     } 
    }; 
</script> 

但現在我必須點擊繼續按鈕兩次。你可以幫我嗎?

回答

0

您將需要遍歷所有問題,並查看在按下繼續按鈕時是否正確檢查它們,而不是在僅選擇一個答案時更改表單的完整驗證狀態。試試這個:

<label><input type="radio" name="otazka1" value="n" /> Yes</label> 
<label><input type="radio" name="otazka1" value="n" /> No</label> 
<label><input type="radio" name="otazka1" value="y" /> spravna</label> 
<label><input type="radio" name="otazka1" value="n" /> asda</label> 

... 

<input type="submit" id="continue" value="Continue" /> 
<script> 
    var continue_button = document.getElementById('continue'); 
    continue_button.onclick = function(event) { 
     var everything_OK = true; 
     var inputs = document.getElementsByTagName("input"); 
     for (var i=0; i<inputs.length; i++) { 
      if (inputs[i].type != "radio") 
       continue; 
      var should_be = inputs[i].value == "y"; 
      if (inputs[i].checked != should_be) { 
       everything_OK = false; 
       break; 
      } 
     } 
     if (everything_OK) { 
      // this is not a good success-page 
      window.location.href = "http://www.facebook.com"); 
     } else { 
      window.location.href = "http://www.google.sk"; 
     } 
    }; 
</script>