0

我在屏幕上有这个小部件，它基于某些服务器端更改其中包含的数据及其类，并响应鼠标点击它。我正在使用 SignalR 同时通知多个客户端更新。我遇到的问题是我已经将包括标记在内的所有内容都放在了更新面板中（否则我必须每次都回发整个页面，这是一种糟糕的用户体验），并且在第一次回发我的图片后，“ iconThing" ID 不再对按钮点击做出反应。

我使用的原始点击功能是

$("#iconThing").click(function () {
    $(this).parent(".activity-pad").toggleClass("hidden-pad");});

在浏览了各种在线资源和堆栈溢出本身之后，我偶然发现SignalR 更新面板仅在第一次工作时有效，这在理论上应该可以解决我的问题 - 除了我基于它添加的新代码不再响应点击全部（我打赌这是相当解释性的东西，但我对 javascript 和 jquery 还比较陌生，所以我们将不胜感激）

 $(document).on("click", "#iconThing", function(){
        $(this).parent(".activity-pad").toggleClass("hidden-pad");});

标记本身是（PadColorSetter 是一个服务器端字符串，输出基于它。它已经过测试并且正在工作（视觉效果确实按预期改变）它只是似乎杀死自己的 onclick 功能）

    <asp:UpdatePanel runat="server" id="upActivityPadModule" IsUpdatePanel="true">
        <ContentTemplate>
<div class="activity-pad hidden-pad">
  <div class="icon <%# PadColorSetter %>" id="iconThing">
    Activity Pad
  </div>
  <div class="top <%# PadColorSetter %>">
  </div>
  <div class="middle <%# PadColorSetter %>">
    <div class="middle-content">
     <script type="text/javascript">
     // SignalR
     $(function () {
     // Declare a proxy to reference the hub.
     var padUpdater = $.connection.activityPadHub;
     //$.connection.hub.start();

     // Create a function that the hub can call to broadcast messages.
     padUpdater.client.ActivityPadRefresh = function () {

     __doPostBack('<%= upActivityPadModule.ClientID %>', '');
     };

     // Start the connection.
     $.connection.hub.start().done(function () {
     // Call the ActivityPadRefresh method on the hub.
     padUpdater.server.ActivityPadRefresh();
     });
     });
</script>

    </div>
  </div>
  <div class="bottom <%# PadColorSetter %>">
  </div>
</div>
        </ContentTemplate>
      </asp:UpdatePanel>

编辑。：

$("#iconThing").bind("click", function () {

代替 

$(document).on("click", "#iconThing", function(){

似乎对点击做出反应。不幸的是，只有在回发完成之前。

4

1 回答 1

0

万一其他人在同样的问题上苦苦挣扎，拯救我的是：

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function () {
    $("#iconThing").bind("click", function () {
        //$("#iconThing").click(function () {
        $(this).parent(".activity-pad").toggleClass("hidden-pad");
    });
});
于 2013-10-30T17:08:00.547 回答