asp.net回传和javascript / jquery
[英]asp.net postback and javascript/jquery
问题描述
我刚刚在asp.net中发现了一个有趣的行为。
我有一个表单，其中有一个字段集，该字段集在初始加载时是隐藏的，并且有一个提交按钮。
我希望做的是，当用户单击“提交”按钮时，将出现该字段集。 问题是，当我尝试单击“提交”按钮时，它将显示fieldset元素，但会立即失效。
如果您可以向我指出我在代码中哪里做错了什么，方向是否正确？ 请参阅下面的代码。
太感谢了！
干杯安
<%@ Page Language="C#" AutoEventWireup="true" Inherits="JavascriptTest._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Test Javascript</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.js"></script>
<script type="text/C#" runat="server">
protected void Page_Load(object sender, EventArgs e)
{
}
</script>
<script type="text/javascript">
$(document).ready(function () {
var btnSubmit = '#<%= btnSubmit.ClientID %>';
$('#result').hide();
$(btnSubmit).click(function () {
$('#result').show();
return true;
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<fieldset id="result">
<legend>Search Result</legend>
<p>Cras risus. Parturient lectus! Ac quis. Enim arcu adipiscing nunc? Porta magna ultrices elit amet, turpis vel nunc, massa pulvinar sit, pulvinar amet elementum tristique diam parturient, eu in dolor, non pulvinar nisi, penatibus? Velit tincidunt? Pulvinar nec urna ac, pulvinar purus integer phasellus, ridiculus non dictumst penatibus dolor rhoncus elementum pellentesque? Adipiscing et, dapibus, amet ac porta! Magna tristique, sed porta elit mid. Et ultricies et elit mattis. Arcu! Elementum ac? Nisi turpis, vel in massa pellentesque porta lectus, egestas aenean scelerisque risus? Placerat purus cum et. Egestas sociis, adipiscing porttitor scelerisque integer? Auctor a arcu sit aliquam amet sed odio, velit turpis, risus, porttitor mid diam, ac arcu lectus auctor, facilisis tincidunt! Et, proin, turpis nunc velit? Elementum.</p>
</fieldset>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
</div>
</form>
</body>
</html>
4 个解决方案
解决方案1
4 已采纳 2010-12-06 02:29:39
默认的按钮行为在此处生效，从而导致<form>提交并刷新页面（再次隐藏<fieldset> ）。 您需要使用event.preventDefault()来防止这种默认行为，或者return false ，例如：
$(document).ready(function () {
var btnSubmit = '#<%= btnSubmit.ClientID %>';
$('#result').hide();
$(btnSubmit).click(function (e) {
$('#result').show();
e.preventDefault();
});
});
event.preventDefault()只会阻止提交这里作为return false会杀事件在其轨道上死了......所以我真的考虑return false矫枉过正这里。 最好做您想做的事情，不要多于以后会引起潜在的不必要问题的.delegate()例如，如果您杀死了该事件，那么.live() / .delegate()处理程序将无法工作，等等） 。
解决方案2
1 2010-12-06 02:30:20
您将要“返回假”； 而不是true，以防止按钮引起实际的回发。 我猜您想要的只是客户端操作，因此您返回false。
解决方案3
1 2010-12-06 02:30:26
在按钮功能中，您需要返回false，否则表单将被提交
$(btnSubmit).click(function () {
$('#result').show();
return false; //changed this to return false
});
解决方案4
1 2010-12-06 02:32:27
当您单击按钮时，您正在做回发，然后再次执行$（'＃results）.hide（）...您需要在点击处理程序中执行event.preventDefault（），以防止回发。
ASP.NET回发中的JQuery
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.