Question

非常简单的表格

<form id="addDonor" name="addDonor" onsubmit="addDonor(); return false;" action="" method="post" enctype="multipart/form-data">
<div class="sectionHeader">Add New Donor</div>
<div class="formRow"><label>Name</label> <input class="inputText fullTextBar" type="text" name="userName">
<div class="formRow"><button style="margin-left:350px; width: 80px" type="button" class="publish">Add Donor</button></div>
</form>

addDonor函数

<script type="text/javascript">

function addDonor(){    
    alert("test");
    return false;
}
</script>

最终该函数将包含一些jquery ajax来提交信息。但是，宝贝，步骤。现在我甚至无法收到警报。此外，当我在键盘上点击“Enter”时，整个页面刷新，当我按“Add Donor”时没有任何反应。

我确信它必须是一个简单的问题。我认为这是我需要别人指出的那些事情之一。

Answer 1

尝试在javascript中分配onsubmit事件：

document.getElementById("addDonor").onsubmit = function () {
    alert("test");
    return false;
}

问题是你的函数名为addDonor，你的元素是addDonor。每个具有id的元素都有一个在document下创建的对象来识别它。在内联onsubmit中尝试alert(addDonor)，看它是否警告HTML元素，而不是函数。内联函数在文档中的作用域链中执行，因此addDonor在到达window.addDonor（您的函数）之前指向document.addDonor。

Answer 2

您应该将<button>更改为<input type="submit">（如@ fireshadow52建议的那样），以解决您的问题。你应该尝试Wc3 Schools online javascript tester尝试简单的javascripts，然后再把它放在一个页面中，或者你喜欢的任何其他的javascripts。谷歌有这样的东西。此外，您通常可以在各自的浏览器上试用javascript控制台。

Answer 3

您的按钮已明确设置为type="button"，但不会提交表单。如果您愿意，可将其更改为<button type="submit">或更改为<input type="submit">（我自己喜欢<button>的样式选项）。

Javascript onsubmit导致页面刷新

3 个答案: