javascript - 使用外部 JS 文件捕获 HTML 表单数据

Question

我正在尝试在 HTML 页面(也有 Bootstrap 代码)上创建一个表单，当用户单击提交按钮时，我希望由同一目录中的外部 javascript 文件捕获和处理数据。但是，我认为我这样做不正确，因为当我单击提交按钮时，页面会重新加载，并且添加的结果不会显示在下面。

以下是文件的链接:https://gist.github.com/anonymous/2dc8c07d87469716f9d2

提前致谢!

Answer 1

你必须改变

<button type="submit" class="btn btn-default" method="POST" onclick="process()">Submit</button>

至

<button type="button" class="btn btn-default" onclick="process()">Submit</button>

还有

function process(){
var q1 = document.getElementById("firstquartergrade").value;
var q2 = document.getElementById("secondquartergrade").value;
var result = q1+q2;
document.getElementById("result").innerHTML = result;
}

至

function process(){
var q1 = parseInt(jQuery("#firstquartergrade").val());
var q2 = parseInt(jQuery("#secondquartergrade").val()); 
var result = q1+q2; 
jQuery('#result').html(result);
}