使用javascript提交表單驗證

Question

我想在用戶提交表單時使用javascript驗證表單，這是我的代碼，

 document.getElementById("form").addEventListener("submit", function(event){ var elements = document.getElementById("form").elements; var error = 0; for(var i = 0; i < elements.length; i++) { //code if(elements[i].type == "checkbox" || elements[i].type == "radio") { var check_box = document.getElementById(elements[i].id).checked; if (check_box == false) { //code error++; var checkbox_div = elements[i].parentNode.parentNode.id; produce_warning("you must agree to proceed", checkbox_div, elements[i].id); } } else { if (elements[i].value == "" || elements[i].value == null) { //code error++; produce_warning("you can not leave this field empty", elements[i].parentNode.id, elements[i].id); } } } if (error > 0) { //code event.preventDefault(); } else{ return true; } }); 

這里event.preventDefault（）語句未執行，請幫助我謝謝。

Answer 1

該問題似乎是由於在回調函數中使用了參數event而引起的，請嘗試使用evt ，在此處進行演示： https : //jsfiddle.net/5c4gw4st/1/

document.getElementById("form").addEventListener("submit", function(evt){
    var elements = document.getElementById("form").elements;
    var error = 0;
    for(var i = 0; i < elements.length; i++)
    {
            //code
            if(elements[i].type == "checkbox" || elements[i].type == "radio") {
                var check_box = document.getElementById(elements[i].id).checked;
                  if (check_box == false) {
                      //code
                      error++;
                      var checkbox_div = elements[i].parentNode.parentNode.id;
                      produce_warning("you must agree to proceed", checkbox_div, elements[i].id);
                  }
            }

            else {
                if (elements[i].value == "" || elements[i].value == null) {
                    //code
                    error++;
                    produce_warning("you can not leave this field empty", elements[i].parentNode.id, elements[i].id);
                }

            }
    }

    if (error > 0) {
        //code
        evt.preventDefault();
    }
    else{
        return true;
    }

});

Answer 2

嘗試使用括號表示法：

if (error > 0) {
     //code
     event[preventDefault()];
}

還要檢查事件是否是對象。