Javascript 表单提交后函数没有被执行

Question

我有一个表单，想在按下提交按钮后执行此功能：

function bereken() {


    if(document.getElementById('v1_1').checked)  {
        c = c - 0
    }else if(document.getElementById('v1_2').checked)  {
        c += 1;
    }else if(document.getElementById('v1_3').checked)  {
        c += 2;
    }else if(document.getElementById('v1_4').checked)  {
        c += 3;
    }else if(document.getElementById('v1_5').checked){
        c += 4;
    }

        var naam = document.getElementById('naamTxt').value;
    var percentages = "C: " + c/40*100 + "%. S: " + s/40*100 + "%. G: "+ g/40*100 + "%. E:" + e/20*100 + "%. I= " + i/20*100 + "%";
    var antwoorden = "1. Ik ben spontaan =" +   $('input[name=v1]:checked', '#myForm').val() + " 2. Mijn gedachten zijn ordelijk = " + $('input[name=v1]:checked', '#myForm').val();
    var li = document.getElementById("klasDown");
    var klas = li.options[li.selectedIndex].value;


    alert(klas + ", "+ naam + " = C: " + c/40*100 + "%. S: " + s/40*100 + "%. G: "+ g/40*100 + "%. E:" + e/20*100 + "%. I= " + i/20*100 + "% " + "1. Ik ben spontaan =" +   $('input[name=v1]:checked', '#myForm').val() + " 2. Mijn gedachten zijn ordelijk = " + $('input[name=v1]:checked', '#myForm').val());
     }

我尝试了不同的方法，通过本站的类似问题进行探索，但没有成功。有人可以指出为什么它没有被解雇吗？

<form id="myForm" method="post" onsubmit="return bereken()" >
Volledige naam: <input name="naamTxt" type="text" maxlength="512" id="naamTxt" class="searchField"/> <br>
Klas: <select name="klasDown">
  <option value="H4A" selected="selected">H4A</option>
  <option value="H4B" >H4B</option>
  <option value="H4C">H4C</option>
  <option value="H4C">H4D</option>
  <option value="H4C">V4A</option>
  <option value="H4C">V4B</option>
  <option value="H4C">V4C</option>
  <option value="H4C">V4D</option>
</select> 
</div>



<br> <input type="submit" name="submit" value="submit" onclick="bereken()">
</form>

我试过onsubmit, onclick等..

Answer 1

发生这种情况是因为您没有通过相应地使用 event.preventDefault() 或 return 和 false 或 true 来阻止浏览器的默认行为。

function [...](e) {
    e.preventDefault();
    [...]
}

改变，

<input type="submit" name="submit" value="submit" onclick="bereken()">

到，

<input type="submit" name="submit" value="submit" onclick="bereken(event)">

为内联事件侦听器传递事件参数。

Answer 2

我认为如果您使用 jQuery，这应该有效。

$("#myForm").submit(function(e){
        e.preventDefault();
        // your code here
});

Javascript 表单提交后函数没有被执行

Javascript function not being executed after form submit

javascript

forms

function

submit