php

type='button'和'submit'的区别

今天在对表单的项目进行删除时出现了问题，原因就出现在点击input按钮时，这个input属性是type='button'还是type='submit'。

代码大致如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<script type="text/javascript">  
    //获得选中文件的文件名  
    function GetCheckfolderItem() {  
        var allSel = '';  
        if (document.form1.deleteid.value) //如果document.form1.deleteid不是数组，只是一个元素，那么直接返回这个元素的值  
        {  
            return document.form1.deleteid.value;  
        }  
        for (i = 0; i < document.form1.deleteid.length; i++) //length属性可获取数组中元素的个数  
        {  
            if (document.form1.deleteid[i].checked) {  
                if (allSel == ''){ allSel = document.form1.deleteid[i].value;}  
                else { allSel = allSel + "," + document.form1.deleteid[i].value;}  
            }  
        }  
        return allSel;  
    }  
  
    function DoSubmit(myfolder) {  
        var selid = GetCheckfolderItem(); //获取选中邮件的id  
        if (selid == '') {  
            alert("你没选中任何信息！");  
            return false;  
        }  
        if (window.confirm("你确定要删除这些消息么？")) {  
            location = "pm.php?dopost=del&ids=" + selid + "&folder=" + myfolder; //folder判断要删的是收件箱还是发件箱的邮件  
        }  
    }  
</script>  
<form action="pm.php" method="post" name="form1">  
    <input type='hidden' name='dopost' value='del' />  
    <table>  
        <tr>  
            <th>标题</th>  
            <th>收件人</th>  
            <th>状态</th>  
            <th>发送时间</th>  
        </tr>  
        {dede:datalist}<!--遍历邮件-->  
        <tr>  
            <td>  
                <input name="deleteid" type="checkbox" value="{dede:field.id/}" /> 一个邮件  
            </td>  
            <td>mqiang02</td>  
            <td>已阅读</td>  
            <td>2013-7-7</td>  
        </tr>  
        {/dede:datalist}  
        <tr>  
            <td>  
                <input type="submit" value="删除选中" onclick="DoSubmit('<?php echo $folder; ?>')"/>  
                <button type="button" onclick="DoSubmit('<?php echo $folder; ?>')">删除选中</button>  
            </td>  
        </tr>  
    </table>  
</form>

先在pm.php中下一个断点die();阻止pm.php对页面的重定向。
结果当我选中某个邮件后，单击第一个按钮时，浏览器的url是：http://localhost/dede/member/pm.php （所选邮件无法删除）
单击第二个按钮时，浏览器的url是：http://localhost/dede/member/pm.php?dopost=del&ids=10&folder=outbox （邮件正常删除）
通过比较可知type='submit'只执行提交表单这一操作，没有执行location这个跳转链接；而type='button'则在执行完onclick()后，跳转文件在 js文件里控制。