1

もう一度、初心者 JS が質問を持って戻ってきました。ユーザーが詳細を送信できるようにする前に、フォームの最後に確認チェックボックスが必要です。チェックボックスがオンになっていない場合、フォームを送信できません。ここを見て、さまざまなコーディング例を使用してみましたが、10ページまたは20ページの異なるコードを見た後、すべてが非常に混乱していることに気づきました. ここに私がこれまでに書いたものがあります.私のフォームが私のチェックボックス検証コードをスキップするだけであることがわかります.これは明らかに私が起こりたくないことです:

<head>
<script>
function validate (){
  send = document.getElementById("confirm").value;

  errors = "";

  if (send.checked == false){
    errors += "Please tick the checkbox as confirmation your details are correct \n";
    } else if (errors == ""){
      alert ("Your details are being sent)
    } else {
        alert(errors);
    }  
  }
</script>
</head>

<body>
  <div>      
    <label for="confirm" class="fixedwidth">Yes I confirm all my details are correct</label>
    <input type="checkbox" name="confirm" id="confirm"/>
  </div>
  <div class="button">
    <input type="submit" value="SUBMIT" onclick="validate()"/>
  </div>
4

3 に答える 3

2

チェックボックスの状態に基づいてボタンを有効/無効にするだけです。ボタンに ID を追加します (送信ボタンの ID は のふりをしますbtnSubmit)

document.getElementById("confirm").onchange = function() {
    document.getElementById("btnSubmit").disabled = !this.checked;
}

デモ: http://jsfiddle.net/tymeJV/hQ8hF/1

于 2013-09-05T17:40:56.280 に答える
0

sendbeconfirmの値を作成しています。

send = document.getElementById("confirm").value;

この方法でsend.checkedはうまくいきません。checked値 (おそらく文字列) から属性を取得しようとしているためです。

正しく使用するには、これを試してください：

send = document.getElementById("confirm");
sendValue = send.value;
sendCheck = send.checked;

次に、でテストできます

if (sendCheck == false){ //sendCheck  evaluate true if checkbox is checked, false if not.

return false;エラーアラートの後、フォームの送信を停止します。

ここに完全なコード -正しく動作するように更新されてい<form>ます (タグに id があることを考慮してtesForm):

 document.getElementById("testForm").onsubmit = function () {
    var send = document.getElementById("confirm"),
        sendValue = send.value,
        sendCheck = send.checked,
        errors = "";

    //validate checkbox
    if (!sendCheck) {
        errors += "Please tick the checkbox as confirmation your details are correct \n";
    }


    //validate other stuff here




    //in case you added more error types above
    //stacked all errors and in the end, show them
    if (errors != "") {
        alert(errors);
        return false; //if return, below code will not run
    }

    //passed all validations, then it's ok
    alert("Your details are being sent"); // <- had a missing " after sent.
    return true; //will submit
}

フィドル: http://jsfiddle.net/RaphaelDDL/gHNAf/

于 2013-09-05T17:39:38.863 に答える
0

これを行うのに JavaScript は必要ありません。最近のすべてのブラウザーには、ネイティブのフォーム検証が組み込まれています。チェックボックスを必須としてマークすると、チェックしない限りフォームは送信されません。

<form>
  <input type="checkbox" required=""/>
  <button type="submit">Done</button>
</form>
于 2018-10-30T22:06:55.383 に答える