【问题标题】:type submit vs type button输入提交与输入按钮
【发布时间】:2010-09-03 02:40:33
【问题描述】:
我有一个按钮,现在设置为“提交”类型。这会调用控制器,执行一些代码并返回视图。当我使用 jquery 隐藏按钮时,我看到当我单击按钮时,我所拥有的隐藏了按钮,但是一旦返回视图,按钮就不再隐藏了。而对于“按钮”类型,当我单击按钮时,这会隐藏按钮但不会执行控制器中的代码。有没有办法隐藏类型“提交”按钮,所以当视图返回时,按钮仍然隐藏?
$('#btnAdd').click(function() {
$('#btnAdd').hide();
});
【问题讨论】:
标签:
c#
javascript
jquery
asp.net-mvc
asp.net-mvc-2
【解决方案1】:
<input type='submit'> 创建一个将表单提交到服务器并触发您的服务器代码的按钮。如果您希望在页面返回时隐藏按钮,则需要向页面添加逻辑来执行此操作。如何执行此操作取决于您的服务器技术(php、.net 等)。
<button> 的行为不同的原因是<button>s 不提交表单(除非您添加更多代码来让他们这样做)......所以上面提到的事情永远不会发生。 <button> 保持隐藏与其说是页面从不更改/重新加载一样多。如果您将代码添加到 <button> 以使其刷新页面,它也会重新出现。
【解决方案2】:
显示按钮是因为提交表单后新显示的页面。您单击并隐藏按钮的“旧”页面是历史记录。
你想要什么?
按下一个按钮,在服务器端做一些事情,不要改变你当前的页面:
使用button类型的按钮,使用ajax调用服务端。
或者使用提交类型的按钮,按照 Pablo 在服务器端 http://en.wikipedia.org/wiki/Post/Redirect/Get 所说的操作。
按下一个按钮,在服务器端做一些事情,给用户反馈:
使用<form method="post" 标记您的表单。使用提交按钮调用服务器端。在服务器端隐藏提交按钮,如果它是通过方法 post 调用的(调用带有链接的页面或在地址字段中键入它是使用 method = get 调用它)。
类型提交和类型按钮有什么区别?
提交按钮无需 javascript 即可向服务器端发送一些输入。周围的表单被发送到服务器并在浏览器中呈现响应。
一个按钮按钮需要一个 javascript onclick 处理程序,一个 javascript 函数。当用户按下按钮时调用 onclick 处理程序。
【解决方案3】:
由于页面将在按下提交按钮时重新加载,因此该按钮将重新出现。获得您想要的东西的一种快速而肮脏的方法是......
首先,创建一个隐藏字段
<input type="hidden" id="hidden" value="" />
然后,当您按下提交时,在提交按钮的单击事件中,执行以下操作..
$('#submit').click(function() {
$('#hiddenField').val("1");
$('#form').submit();
return false;
});
现在在您的控制器中,使用 hiddenField 的值将一些变量传递给可以像这样使用的视图...
<?php if($hidden == "1"): ?>
<input type="submit" id="submit" value="Submit" />
<?php endif; ?>
就按钮不提交表单而言,它不会提交表单,直到您在按钮的点击事件上自己提交表单。像这样的...
$('button').click(function() {
$('#form').submit();
});
当然,正如我所提到的,这是实现所需功能的一种快速而肮脏的方法,还有更好的方法 - 使用 AJAX,实现也可以根据您使用的服务器端语言而改变(我在这里使用了 php )。
【解决方案4】:
当您的表单被提交并且您的控制器处理数据时,如果满足某些条件,您可以在服务器端代码中设置临时会话变量或 cookie。所以,基本上页面会在每次页面加载时检查这个变量。 PHP 中的示例:
if( empty($_SESSION['temp']['hideSubmitButton']) ) {
$submitButton = '<button type="submit">Normal Button</button>';
} else {
$submitButton = '<button type="submit" disabled="disabled">Disabled Button</button>';
// or $submitButton = '';
}
但是您必须决定何时取消设置() $_SESSION['temp'] 或 $_COOKIE['temp'] 变量。