Question

我有一个简单的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();
});

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

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

更新我忘了提到我点击它时显示div的按钮和div都在UpdatePanel（对于Ajax）内部，当我放置时它们在它之外，一切正常（但页面刷新）。

Answer 1

使用此

<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();


    }

Answer 2

盲目猜测：

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

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

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

fiddle

或者您可以使用document：

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

fiddle

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

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

2 个答案: