Jquery FadeIn FadeOut只工作一次。
Jquery FadeIn FadeOut只工作一次。
提问于 2015-04-09 15:50:24
我有LinkButton，点击显示asp:panel，其中包含图像和关闭按钮。面板id为LinkButton1，面板中的关闭按钮id为close，除了FadeIn只触发一次外，它工作正常。如果我刷新整个页面，它会再次工作，但我不希望用户刷新到能够重复fadein/fadeout面板。
<asp:LinkButton runat="server" ID="LinkButton1" CssClass="navButtons" >Restorant</asp:LinkButton>
$(document).ready(function () {
$('#LinkButton1').click(function () {
$('#Viewer').fadeIn(1000);
});
$('#close').click(function () {
$('#Viewer').fadeOut(1000);
});
});
<body >
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:Panel runat="server" ID="Viewer" CssClass="Viewer">
<asp:Image runat="server" ID="ViewerImage" CssClass="ImageV" ImageUrl="~/Hotel/as.jpg" />
<asp:Image runat="server" ID="close" CssClass="close" ImageUrl="~/Background/close.jpg" />
</asp:Panel>回答 3
Stack Overflow用户
回答已采纳
发布于 2015-04-09 16:02:47
如果遇到事件绑定问题，可以尝试以下操作：
$(document).ready(function () {
$('body').on('click', '#LinkButton1', function(){
$('#Viewer').fadeIn(1000);
});
$('body').on('click', '#close', function(){
$('#Viewer').fadeOut(1000);
});
});Stack Overflow用户
发布于 2015-04-09 16:04:26
尝试如下:将函数绑定到主体
$(function {
$('body').on('click', '#LinkButton1', function () {
$('#Viewer').fadeIn(1000);
});
$('body').on('click', '#close', function () {
$('#Viewer').fadeOut(1000);
});
});Stack Overflow用户
发布于 2015-04-09 16:09:48
首先，链接按钮在身体元素之外，这是错误的。
其次，默认情况下，ASP.NET元素ID与呈现给它们的DOM元素的id不匹配。
为了获得真实的ID，请使用ClientID属性：
var lbId = '#<%= LinkButton1.ClientID %>'
, viewerId = '#<%= Viewer.ClientID %>'
, closeId = '#<%= close.ClientID %>'
$(function() {
var lb = $(lbId)
, viewer = $(viewerId)
, close = $(closeId)
lb.on('click', viewer.fadeIn.bind(viewer, 1000))
close.on('click', viewer.fadeOut.bind(viewer, 1000))
})如果您的代码实际上是在updatepanel或其他东西中，这实际上会更改DOM并将元素放入DOM并将元素从DOM中提取出来，那么您有两个选项：
- 在jQuery中使用事件委托
- 订阅UpdatePanel事件
对于事件委托，将代码更改为：
var lbId = '#<%= LinkButton1.ClientID %>'
, viewerId = '#<%= Viewer.ClientID %>'
, closeId = '#<%= close.ClientID %>'
$(function() {
var body = $('body')
, viewer = $(viewerId)
body.on('click', lbId , viewer.fadeIn.bind(viewer, 1000))
body.on('click', closeId , viewer.fadeOut.bind(viewer, 1000))
})如果您确实具有updatepanel，并且出于某些原因不想使用事件委托，请使用以下答案中的代码：Jquery class selector is not working in ASP.Net Gridview
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/29543224
复制相关文章
相似问题
腾讯云开发者
