onclick使用javascript單選按鈕

Question

我正在嘗試為該調查編寫該程序，我希望用戶回答該問題，完成調查后，他們將單擊“提交”，並顯示對選擇的確認。 我無法讓它為我的一生工作。

這是我的代碼：

<!DOCTYPE html>
<title> Satisfaction Survey </title>
<script Language ="Javascript">
  function testpage() {  
    errmsg = " ";
    confirmmsg = " ";
    errflag = false; 

    if ( document.form1.rdservice[0].checked == true ) {
      confirmmsg = confirmmsg + "<br> Overall is very satsified" ;
    }

    if ( document.form1.rdservice[1].checked == true ) {
      confirmmsg = confirmmsg + "<br> Overall is satisfied" ;
    }

    if ( document.form1.rdservice[2].checked == true ) {
      confirmmsg = confirmmsg + "<br> Overall is neutral" ;
    }

    if ( document.form1.rdservice[3].checked == true ) {
      confirmmsg = confirmmsg + "<br> Overall is unsatsified" ;
    }

    if ( document.form1.rdservice[4].checked == true ) {
      confirmmsg = confirmmsg + "<br> Overall is very unsatsified" ;
    }

    if ( (doucment.form1.rdservice[0].checked == false) &&        
         (doucment.form1.rdservice[1].checked == false) && 
         (doucment.form1.rdservice[2].checked == false) && 
         (doucment.form1.rdservice[3].checked == "false") && 
         (doucment.form1.rdservice[4].checked == false)) {
      errflag = true;
      errmsg  = errmsg + "<br> You forgot to select an option";
    }
  }
</script>

<body>
  <form  name=form1  method="post">
    <fieldset>
      <legend> Please take a few moments to complete this satisfaction survey.  </legend>   
    <fieldset>  
    <legend> Overall, how satisfied were you with the product / service? </legend>
    <input type="radio" name="rdservice" value="v"> Very Satisfied
    <br>
    <input type="radio" name="rdservice" value="s"> Satisfied
    <br>        
    <input type="radio" name="rdservice" value="n"> Neutral
    <br>
    <input type="radio" name="rdservice" value="un"> Unsatisfied
    <br>
    <input type="radio" name="rdservice" value="vu"> Very   Unsatisfied
  </fieldset>
  <fieldset>
    <input type="submit" name="subm1" value="Submit"  onclick="testpge()">
    <input type="Reset"  name="Res1"  value="Reset Form">
  </fieldset>       
  </fieldset>
</body>
</form>
</html>

Answer 1

代碼有點混亂，我可以建議使用jquery（ https://jquery.com/download/ ）嗎？ 它將使您的生活更加輕松！

這是您需要的jQuery代碼：

var confirmmsg = "";
var errflag = false; 
var errmsg = "";

$.each($('form input[type=radio]'), function() {
    if($(this).is(":checked")) {
      confirmmsg += "<br> Overall is " + $(this).text();
    } else {
      errflag = true;
    }  
});

if (errflag) {
  errmsg  = "<br> You forgot to select an option";
}

此代碼接受每個輸入單選元素，並檢查是否已選中，然后進行確認。如果其中一個未選中，則errflag變為true，同時設置errmsg

順便說一句，我認為您需要復選框而不是單選輸入

Answer 2

（非jQuery方法）

作為“按鈕”的表單輸入只是按鈕。 您可以將事件附加到這些輸入，但是它們與提交表單無關。 如果要制作發送表單的按鈕，則應將“類型”屬性設置為“提交”。 然后，您可以通過將事件“ onsubmit”添加到<form>標記而不是按鈕中來驗證JavaScript中的<form> 。 如果有人按下清除表單的按鈕，也可以使用“ onreset”來捕獲事件。 如果要添加“ onsubmit”功能，例如：

onsumit="return testpage(this);"

您可以輕松決定在該函數內部，是否應該發送表格。 您可以通過返回值來實現。 如果返回true，則將發送表格，如果返回false，則將不發送表格。 您還可以通過將<form>標記的“ action”屬性設置為“ javascript：void（0）;”來禁用發送表單。

在您的代碼中，我會將“ onsubmit”事件添加到<form>標記中，並且將從提交按鈕中刪除“ onclick”（您正在調用函數，然后發布表單），並且我還將函數代碼更改為：

function testpage(frm)
{
  var radioBoxSelected = false;
  for(var i=0; i < frm.elements.length;i++)
  {
    if (frm.elements[i].type == 'radio' && frm.elements[i].checked) {
      radioBoxSelected = true;
      val = frm.elements[i].value;
      // You can move messages to attribute "value" of radio boxes
      alert('You have selected: ' + val);
      // Below line sets some tag inner content to radiobox "value" attribute
      document.getElementById("satisfied_value").innerHTML = val;
      // Uncomment if you want send form here
      //return true;
    }
  }
  if (!radioBoxSelected) {
    alert('Please select option!');
    return false;
  }
}

onclick使用javascript單選按鈕

問題描述

2 個解決方案

解決方案1
0 已采納 2016-02-21 20:02:21

解決方案2
0 2016-02-21 20:06:15

onclick使用javascript單選按鈕

問題描述

2 個解決方案

解決方案1 0 已采納 2016-02-21 20:02:21

解決方案2 0 2016-02-21 20:06:15

解決方案1
0 已采納 2016-02-21 20:02:21

解決方案2
0 2016-02-21 20:06:15