在我进行服务器端 asp.net 调用后，JQuery 切换停止工作？

发布于 2024-10-07 18:38:21 字数 1141 浏览 0 评论 0原文

我有一个名为地址的 div 作为文本区域。当我单击超链接时，它会上下切换 div。单击 asp.net 按钮后，div 折叠，这很好，但我注意到 url 从 www.abc.com/edit.aspx?Id=2 变为 www.abc.com/edit.aspx?Id2=2#现在切换不起作用。

这是脚本：

$(document).ready(function () {

    $('#myAddress').click(function () {
        ShowHideAddressBox();
    });
    $('#arrowIndicator').click(function () {
        ShowHideAddressBox();
    });
});
function ShowHideAddressBox() {
    var str = $("#myAddress").text();
    if (str == "Hide") {
        $("#myAddress").html("Click here");
        $("#arrowIndicator").attr("src", "/Shared/Images/misc/arrow_state_grey_expanded.png");
    }
    else {
        $("#myAddress").html("Hide");
        $("#arrowIndicator").attr("src", "/Shared/Images/misc/arrow_state_grey_collapsed.png");
    }

    $('#checkAddress').toggle('normal');
}

单击服务器端按钮只是在几个文本框中设置一些值。

在我的母版页中，我还有以下行：

<asp:ScriptReference Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
            Name="MicrosoftAjax.js" Path="http://ajax.microsoft.com/ajax/3.5/MicrosoftAjax.js" />

原文

I have a div called address which as a textarea. When I click a hyperlink, it toggles the div up and down. After clicking a an asp.net button the div collapses which is fine, but I noticed the url turns from www.abc.com/edit.aspx?Id=2 to www.abc.com/edit.aspx?Id2=2# and now the toggle does not work.

Here is the script:

$(document).ready(function () {

    $('#myAddress').click(function () {
        ShowHideAddressBox();
    });
    $('#arrowIndicator').click(function () {
        ShowHideAddressBox();
    });
});
function ShowHideAddressBox() {
    var str = $("#myAddress").text();
    if (str == "Hide") {
        $("#myAddress").html("Click here");
        $("#arrowIndicator").attr("src", "/Shared/Images/misc/arrow_state_grey_expanded.png");
    }
    else {
        $("#myAddress").html("Hide");
        $("#arrowIndicator").attr("src", "/Shared/Images/misc/arrow_state_grey_collapsed.png");
    }

    $('#checkAddress').toggle('normal');
}

The server-side button click just sets some values in a couple textboxes.

In my master page, I have the following line as well:

<asp:ScriptReference Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
            Name="MicrosoftAjax.js" Path="http://ajax.microsoft.com/ajax/3.5/MicrosoftAjax.js" />

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

祁梦 2024-10-14 18:38:21

您所看到的是因为元素正在被替换，并且它们不再具有处理程序，您应该替换它：

$(document).ready(function () {
    $('#myAddress').click(function () {
        ShowHideAddressBox();
    });
    $('#arrowIndicator').click(function () {
        ShowHideAddressBox();
    });
});

使用 .live() 处理程序如下：

$(function () { //shortcut for $(document).ready(function () {
  $('#myAddress, #arrowIndicator').live('click', ShowHideAddressBox);
});

What you're seeing is because the elements are being replaced, and they no longer have the handlers, you should replace this:

$(document).ready(function () {
    $('#myAddress').click(function () {
        ShowHideAddressBox();
    });
    $('#arrowIndicator').click(function () {
        ShowHideAddressBox();
    });
});

With a .live() handler like this:

$(function () { //shortcut for $(document).ready(function () {
  $('#myAddress, #arrowIndicator').live('click', ShowHideAddressBox);
});

回复收藏 0 原文

怪我闹别瞎闹 2024-10-14 18:38:21

您需要阻止锚点的默认操作（即跟随 href）。如果您将锚点 href 设置为“#”并且不使用它，它将把 # 附加到地址栏中的 url 中。

$('#arrowIndicator').click(function (ev) {
        ev.preventDefault();
        ShowHideAddressBox();
});

You need to prevent the default action of the anchor (which is to follow the href). If you have got your anchor href set to '#' and do not use this it will append the # to the url in the address bar.

$('#arrowIndicator').click(function (ev) {
        ev.preventDefault();
        ShowHideAddressBox();
});

回复收藏 0 原文

清风疏影 2024-10-14 18:38:21

实际上你可以使用这样的东西：

$(document).ready(function () {
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);

    function EndRequestHandler(sender, args) {
      //Code that runs after a post back with an update panel has occurred.  
    } 
      //Code on page load.
});

函数 EndRequestHandler 外部的代码将与其内部的代码相同。

当我刚接触 ASP.NET 和一般编程时，我使用了更新面板。我很快就学会了使用 jQuery ajax，这是比更新面板更好的解决方案。我建议你检查一下。

Actually you can use something like this:

$(document).ready(function () {
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);

    function EndRequestHandler(sender, args) {
      //Code that runs after a post back with an update panel has occurred.  
    } 
      //Code on page load.
});

The code outside of the function EndRequestHandler would be the same as inside of it.

I used update panels when I was new to asp.net and programming in general. I quickly learned to use jQuery ajax, which is way a better solution than update panels. I suggest you check it out.

回复收藏 0 原文

~没有更多了~