加载页面时 Asp.net 运行 Javascript

本文关键字:net 运行 Javascript Asp 加载 | 更新日期: 2023-09-27 18:34:07

我想知道是否有办法在 asp.net 页面联系服务器时运行JS代码。即我正在寻找一个通用事件处理程序,每当对 runat="server" 组件调用服务器时都会触发该处理程序。

我知道有一种方法可以让jQuery.ajax((在调用服务器之前和之后运行JS代码,但我不确定如何在 asp.net 中做到这一点。特别是,由于该项目使用了很多自定义组件。

这里的目标是在单击按钮时显示某种加载图像,以防止用户单击按钮两次,并向用户显示系统正在工作。

如果单击导致页面或更新面板刷新,我只想在刷新之前显示加载图像,例如。用户单击,显示"加载",刷新页面/更新面板(导致"加载"消失(,新页面/内容正常显示。

更新 1:我无法使用UpdateProgress,因为某些按钮不在UpdatePanel中。我真正想做的是一旦单击任何将联系服务器的按钮/控件,就立即触发 JS。即,如果用户单击不联系服务器的下拉列表,则不应发生任何操作。但是,如果该下拉列表与服务器有任何连接,则应运行 JS。

我知道这是 ASP.NET Ajax 而不是 jQuery Ajax,我只用 jQuery 作为示例。因为我之前使用过jQuery方法(使用jQuery Ajax(在进行服务器调用之前触发JS。例如。以锁定已单击的元素或显示"正在加载..."屏幕。

我当然可以为每个页面添加一些 JS hack,手动为每个按钮添加一个"onclick"事件,但我认为如果有一个通用的解决方案会更好(因为我有很多页面,每个页面都有几个按钮联系服务器上的服务器(。

更新 2:当我考虑它时,它不一定需要是触发的 JS。如果页面以某种方式只确保同一按钮没有被单击两次,那就足够了。通过取消按钮或在其前面添加一些内容(例如"正在加载..."屏幕(。

加载页面时 Asp.net 运行 Javascript

您可以使用 UpdateProgress 与更新面板一起使用,但是如果您正在执行整页回发(即不是 ajax(,您可以拥有的唯一加载动画是浏览器自己的。

更新进度:

 <asp:UpdateProgress ID="UpdateProgress1" runat="server">
    <ProgressTemplate>
       Shiny loading aninmation
    </ProgressTemplate>
  </asp:UpdateProgress?

以下是使用 jquery 的方法:

$(function() {
    $('a[href]').on('click', function(e) {
        var self = this;
        e.preventDefault();
        loadAsync($(self).attr('href'));
    });
});
function loadAsync(url) {
    $('div#result').fadeOut(200, function() {
        $('div#loader').fadeIn(200, function() {
            $.get(url, function(data) {
                $('div#result').html($(data));                    
            }).done(function() {
                console.log('done');
            }).fail(function() {
                $('div#result').html('Error');
            }).always(function() {
                $('div#loader').fadeOut(200, function() {
                    $('div#result').fadeIn(200);
                });
            });
        });
    });
}