一个表单多个按钮提交区分判断的方法

31,464次阅读
5 条评论

共计 3341 个字符,预计需要花费 9 分钟才能阅读完成。

 
在一个表单中有多个个提交按钮,想实现点击不同的按钮,实现不同的操作。那么该怎么办呢?

此时我们可以用javascript脚本判断来进行选择。参考方案如下各示例。

参考方案1:

在开头定义javascript然后在正文中的按钮上用onClick="return calc_form()"来转向

function print_form()
{
document.form.action = "print_page.php?id=<?=$id?>";
document.form.target = "_blank";
}
function sub_form()
{
document.form.input_ok.value = 1;
document.form.action = "buy_list.php?id=<?=$id?>";
document.form.target = "";
}
function save_form()
{
document.form.input_ok.value = 2;
document.form.action = "buy_list.php?id=<?=$id?>";
document.form.target = "";
}

参考方案2:

最简单的办法:为每一个按钮写一段脚本

<form id=frm1 name=frm1 method=post action="">
<input id=sendvalue name=sendvalue>
<input type=button id=btn1 name=btn1 onclick="send1()" value="提交1">
<input type=button id=btn1 name=btn1 onclick="send2()" value="提交2">
<input type=button id=btn1 name=btn1 onclick="send3()" value="提交3">
</form>
<script>
function send1() {
frm1.sendvalue = 1;
frm1.submit();
}
function send2() {
frm1.sendvalue = 2;
frm1.submit();
}...
</script>

参考方案3:

switch ($submit)
{
case "添加":
echo "选择的是添加";
break;
case "删除":
echo "选择的是删除";
break;
case "重命名":
echo "选择的是重命名";
break;
}

参考方案4:

一个表单多个按钮,用脚本实现表单的分向提交的另一种方法

<form method="post" action="option.php?action=mailsend_out" id="writemail">
<input type="submit" value="发送邮件" onClick="sendmail()" id="sendmaila">
<input type="button" value="存为草稿" onClick="savedraft();" id="saveddd">
<input type="hidden" name="saveD" value="">
<input type="button" onClick="history.back();" value="返回" id="backhistory">
<script>
function savedraft() {
document.getElementById("saveD").value = "savedraft";
//alert(document.getElementById("saveD").value);
document.getElementById("writemail").submit();
}
function sendmail() {
document.getElementById('sendmaila').disabled = 'disabled';
document.getElementById('sendmaila').value = '发送中,请等待…..';
document.getElementById('saveddd').disabled = 'disabled';
document.getElementById('backhistory').disabled = 'disabled';
document.getElementById('writemail').submit();
}
</script>
</form>
</coolcode>

其中<input type="hidden" name="saveD" value="">是关键,也就是设置一个hidden的input,在按了不同的按钮赋值给此hidden不同的值,那么在option.php?action=mailsend_out的处理步骤中只要判断saveD的value就可以了
此条目发表在 javascript 分类目录。将固定链接加入收藏夹。

参考方案5: 

在某些情况下,我们希望同一个表单可以根据用户的选择,提交给不同的后台处理程序。

即,表单的分向提交。如,我们希望实现用户在发送贴子的时候,既发送提交功能又有预览功能时,就会遇到上述问题。即,当用户点击提交按钮时,我们希望表单提交给"提交"处理程序;而当用户点击预览按钮时,我们希望表单提交给"预览"处理程序。那么,如何实现上述功能呢?下面代码可以很好的解决这个问题。

<form name="form" method="post">
测试表单:
<input name="test">
<br>
<input type="button" value="提交" onClick=send()>
<input type="button" value="预览" onClick=preview()>
</form>
<script language=javascript>
function send() {
document.form.action = "send.asp"
document.form.submit()
}
function preview() {
document.form.action = "preview.asp"
document.form.submit()
}
</script>

关于上面实例的两点说明:

        1、在整个表单中,不应有名字为action或submit的标签,否则将会产生"对象不支持此属性和方法"的错误(但是在firefox中这个没有报错)。如代码 "<input type=''xxxx'' name=''action'' >"在表单中是不允许出现的;

        2、在form标签中应该存在name属性。即,应该给表单取一个名字。语句document.form.action和document.form.submit中的"form"也就是表单的名字。

        表单的分向提交不仅仅使用在论坛的程序中,它还可以运用在许多场合下。恰当的运用表单的分向提交功能可以大大的增强网站的人性化程度。

        有时调试程序就出现了这样的问题,就是出现了"对象不支持此属性和方法"的错误,一直无法定位出来,都快疯掉了,原来就是因为一个button命名为submit了。
 

参考方案6:

一个文本框两个按钮怎么分别提交数据 ?

<script language=javascript>
function ask() {
document.all.dform.action = "ask.asp";
document.all.dform.submit();
}
</script>
<form action="search.jsp" method=get name=dform>
<input type=text>
<input type=submit value="搜索">
<input type=button value="提问" onclick="cancel();">
</form>

正文完
 0
任侠
版权声明:本站原创文章,由 任侠 于2012-09-18发表,共计3341字。
转载说明:除特殊说明外本站文章皆由CC-4.0协议发布,转载请注明出处。
评论(5 条评论)
验证码
加盟店排行榜 评论达人 LV.1
2012-10-21 18:42:01 回复

今天提早来拜访楼主,楼主的文字工笔感觉很适合我们阅读,感谢楼主的文章,很不错,坚持写下去,兄弟我们支持你!

     中国上海上海市联通
圆刀片 评论达人 LV.1
2012-10-16 03:27:38 回复

我们希望实现用户在发送贴子的时候,既发送提交功能又有预览功能时,就会遇到上述问题。

     中国安徽省蚌埠市电信
长春PBT 评论达人 LV.1
2012-10-01 20:15:52 回复

我们希望实现用户在发送贴子的时候,既发送提交功能又有预览功能时,就会遇到上述问题。

     中国安徽省蚌埠市电信
cnjoel博客 评论达人 LV.1
2012-09-20 19:40:15 回复

兄弟 申请交换链接
我的 cnjoel博客 http://www.cnjoel.com/
贵站做好了,请查。
[reply=任侠,2012-09-20 04:45 PM]挺好的博客,链接已添加,欢迎时常互访![/reply]

     中国江苏省苏州市电信
2012-09-19 19:06:12 回复

这个方法不错。

     中国江苏省南通市电信