通过ASP显示后，通过JQuery与元素交互

本文关键字：通过 元素 交互 JQuery ASP 显示 | 更新日期: 2023-09-27 18:20:01

我有一个简单的div。

<div id="error" class="notifications" runat="server" visible="false" ClientIDMode=Static></div>

正如您所注意到的，这个div有runat="server"，这样我就可以从服务器操作它，还有ClientIDMode=Static，这样服务器就不会更改ID，visible="false"从一开始就隐藏它。

在ASP中执行了一些代码后，我通过：显示div

error.Visible = true;

现在我做了一个小的JQuery函数来隐藏这个div，以防我点击它

$("#error").click(function() {
        $(this).fadeOut();
});

这不起作用，我还用$(".notifications")替换了$("#error")，但没有成功。

注意：如果我删除visible=false并点击它，它就会消失，它正在工作。

UPDATE我忘了提一下，当我点击div时显示div的按钮和div都在UpdatePanel（对于Ajax）中，当我把它们放在它之外时，一切都正常（但需要页面刷新）。

通过ASP显示后，通过JQuery与元素交互

使用此

<div id="error" class="notifications" runat="server" href="javascript:void(0);"  onclick="fademe('errordiv')" visible="false" ClientIDMode=Static></div>

并添加javascript函数

function fademe(id){
alert('errordiv is clicked');
var container=document.getElementById('error');
containe.fadeOut();

}

或

function fademe(id){
    alert('errordiv is clicked');
    $('#error').fadeOut();

    }

或

function fademe(id){
    alert('errordiv is clicked');
   error.fadeOut();

    }

盲目猜测：

您正在从$(function(){ ... })调用$('#error').click(function(){ ... })，在#error节点实际出现在DOM中之前。

如果是这种情况，您可以将事件委派与.on函数一起使用：前提是您的UpdatePanel在页面加载时出现在DOM中：

$(UpdatePanel).on('click', '#error', function(){ ... });

小提琴

或者您可以使用document:

$(document).on('click', '#error', function(){ ... });

小提琴

以下是对事件委派的一个很好的解释：Direct vs.Delegated-jQuery.on（）

相关文章：