Fatal编程技术网

Javascript 点击提交？

javascript forms

Javascript 点击提交？,javascript,forms,onclick,submit,Javascript,Forms,Onclick,Submit,我对javascript比较生疏，但现在我有一个表单，可以通过点击来修改，然后在最后，他们应该能够点击提交按钮来实际提交和保存表单 所有其他按钮都可以很好地触发各自的javascript函数，但按下这一按钮时，应该会改变特定标记的innerHTML 它会更改该id的innerHTML，但之后会立即提交表单。我尝试重命名id，它产生了相同的结果。我甚至试着改变它触发的函数，结果也一样。如果我将其影响的id更改为在此id之后出现的任何id，例如var id='planopt'，它工作得很好，更改了i

我对javascript比较生疏，但现在我有一个表单，可以通过点击来修改，然后在最后，他们应该能够点击提交按钮来实际提交和保存表单

所有其他按钮都可以很好地触发各自的javascript函数，但按下这一按钮时，应该会改变特定标记的innerHTML

它会更改该id的innerHTML，但之后会立即提交表单。我尝试重命名id，它产生了相同的结果。我甚至试着改变它触发的函数，结果也一样。如果我将其影响的id更改为在此id之后出现的任何id，例如var id='planopt'，它工作得很好，更改了innerHTML，并且不提交表单

任何帮助都将不胜感激。下面是一个综合代码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script>
function changePlan(x,action){
    if(action == 'change'){
        var id = 'nameofplan';
        document.getElementById(id).innerHTML = x;
    }
}
</script>
</head>

<body>
<form action='' method='post' name='quote'>
    <table border='0' style='border-collapse:collapse;' width='100%' id='serviceplan'>
        <tr style='border-bottom: 2px solid #3D3D3D;'><th align='left' colspan='2'>Description</th><th align='left' width='30%'>Quantity</th><th width='10%'>Price</th><th align='right' width='25%'>Total</th></tr>
        <tr style='border-bottom: 1px solid #3D3D3D;'><td class='subt' colspan='5'>Service Plan</td></tr>
        <tr style='border-bottom: 1px dotted #3D3D3D;'>
            <td align='left'><span id='nameofplan'>Your Plan</span></td>
            <td id='planopt'><button class='button square blue effect-2' onclick="changePlan('Your New Plan','change');">Change</button></td>
            <td>1</td>
            <td align='center'>$<span id='planprice'>1.00</span>/month</td>
            <td align='right'>$<span id='subplan'>1.00</span></td>
        </tr>
    </table>
</form>
</body>
</html>
向按钮元素添加type='button'属性。默认情况下，表单元素中的按钮元素充当提交按钮

使用return false或preventdefault是错误的方法，因为您只是在抑制问题的症状，即您的按钮是submit按钮。

捕获事件并取消默认操作

onclick = function (event) {
    event.preventDefault();
}
你也可以返回false；在函数结束时，但如果出现任何错误，它将不会取消默认操作。

它已经是一个按钮。那应该是。我没有downvote@FritsvanCampen可能您不知道按钮上的type属性。如果按钮的类型未指定为按钮，则在某些浏览器中，默认情况下它将提交其所在的表单。就是这样！默认情况下，该按钮将是一个提交按钮。测验我知道HTML有一些怪癖，但我不相信任何头脑正常的人都会设计一种包含以下内容的语言：P如果它在规范中，你能找到它吗？@FritsvanCampen这很愚蠢，但它可以区分表单中的默认值，这就像用divs样式的display制作一个表：table-*。与其抑制提交操作，首先不要使用提交按钮。你为什么这么说？本机元素的某些默认行为是可取的。在表单中有一个sumbit按钮非常方便，因此按下[enter]键可以工作，例如，当您仍然可以让表单通过AJAX提交其数据时。或者有一个执行JavaScript的链接也需要取消默认的点击操作。当然，当你想要一个提交按钮时，有一个提交按钮是很方便的。在这种情况下，OP想要的是相反的，一个非提交按钮，所以我不认为使用一个提交按钮并修补它的行为像一个非提交按钮有什么意义。还有其他方法可以实现这一点。我认为这是错误的。他也不应该在HTML中使用innerHTML或内联JavaScript调用。OP显然是个新手，我希望我的建议至少能拓宽他对事件的理解，让他学会更有效地使用它们。 
onclick = function (event) {
    event.preventDefault();
}

onclick = function (event) {
    event.preventDefault();
}