更新面板中的链接按钮导致页面刷新

Posted 2023-05-08

【中文标题】更新面板中的链接按钮导致页面刷新

【英文标题】：Link Button in Updatepanel causes page refresh

【发布时间】：2015-01-14 11:35:52

【问题描述】：

我正在开发网络应用程序。我想要中继器控件中的链接按钮。此中继器控件位于更新面板中。现在单击链接按钮会导致刷新。

我找到了解决方案，需要添加ClientIDMODE="AutoID"。它工作正常。但我的其他 javascript 停止工作。那么有什么替代方案可以让两者都能正常工作吗？

由于ClientIDMODE="AutoID" 而无法运行的 jquery 代码。

function setPage() 
            var page = document.location.pathname.match(/[^\/]+$/)[0];
            var pageName = page.split('.')[0];
            if (pageName != 'Default') 
                if ($('#' + pageName).hasClass('main')) 
                    $('#' + pageName).addClass('active');
                    var content = '<li><div class="sidebar-toggler hidden-phone"></div></li><li><a href="/Default.aspx">Dashboard<i class="icon-"></i></a></li>' + $('#' + pageName).children('ul').html();
                    $('#leftNavigation').append(content);
                    var currentActive = $('.nav ul li ul li.active');
                    if (currentActive != null) 
                        currentActive.removeClass('active');
                        currentActive.closest('ul').closest('li').removeClass('active');
                    
                
                else 
                    if ($('#' + pageName) != null) 
                        if ($('#' + pageName).closest('ul').html() != null) 

                            $('#' + pageName).closest('ul').closest('li').addClass('active');
                            $('#' + pageName).addClass('active');
                            var listItems = '<li><div class="sidebar-toggler hidden-phone"></div></li><li><a href="/Default.aspx">Dashboard<i class="icon-"></i></a></li>' + $('#' + pageName).closest('ul').html();
                            $('#leftNavigation').append(listItems);
                            var currentActive = $('.nav ul li ul li.active');
                            if (currentActive != null) 
                                currentActive.removeClass('active');
                                currentActive.closest('ul').closest('li').removeClass('active');
                            
                        

                        else 
                            var directory = document.location.pathname.substring(1, document.location.pathname.lastIndexOf('/'));
                            var dir_name = directory.toLowerCase() + '_main'
                            if (directory != null || '/') 
                                $('#' + dir_name).addClass('active');
                                var content = '<li><div class="sidebar-toggler hidden-phone"></div></li><li><a href="/Default.aspx">Dashboard<i class="icon-"></i></a></li>' + $('#' + dir_name).children('ul').html();
                                $('#leftNavigation').append(content);
                                var currentActive = $('.nav ul li ul li.active');
                                if (currentActive != null) 
                                    currentActive.removeClass('active');
                                    currentActive.closest('ul').closest('li').removeClass('active');
                                
                            
                        
                    
                
            
            else 
                var listItems = '<li><div class="sidebar-toggler hidden-phone"></div></li><li class="active"><a href="/Default.aspx">Dashboard<i class="icon-"></i></a></li>';
                $('#leftNavigation').append(listItems);
            
        

【问题讨论】：

请创建一个小提琴并发布您的所有代码，以便我们可以准确了解您在做什么 jsfiddle.net

【参考方案1】：

每当您引用您需要的将 clientid 模式设置为 auto 的项目时，您需要引用控件的 ClientID 而不是 ID。你可以这样做：

$("#<%= mycontrol.ClientID %>").dosomething();

这会写出为任何带有 runat="server" 的控件的客户端脚本生成的唯一 ID。

【讨论】：

感谢您的建议，但我能再帮个忙吗？如何以您建议的形式表示$('#' + pageName)？这里 pageName 是一个字符串。

【参考方案2】：

实际上我尝试了不同的方案来解决这个问题。我使用 classname 而不是 id 来识别元素。

所以在 jquery 中使用 . 代替 # 并在 html 代码中添加与 id 相同的类名。

所以现在 Jquery 代码是：

function setPage() 
            var page = document.location.pathname.match(/[^\/]+$/)[0];
            var pageName = page.split('.')[0];
            if (pageName != 'Default') 
                if ($("."+pageName).hasClass('main')) 
                    $('.' + pageName).addClass('active');
                    var content = '<li><div class="sidebar-toggler hidden-phone"></div></li><li><a href="/Default.aspx">Dashboard<i class="icon-"></i></a></li>' + $('.' + pageName).children('ul').html();
                    $('#leftNavigation').append(content);
                    var currentActive = $('.nav ul li ul li.active');
                    if (currentActive != null) 
                        currentActive.removeClass('active');
                        currentActive.closest('ul').closest('li').removeClass('active');
                    
                
                else 
                    if ($('.' + pageName) != null) 
                        if ($('.' + pageName).closest('ul').html() != null) 

                            $('.' + pageName).closest('ul').closest('li').addClass('active');
                            $('.' + pageName).addClass('active');
                            var listItems = '<li><div class="sidebar-toggler hidden-phone"></div></li><li><a href="/Default.aspx">Dashboard<i class="icon-"></i></a></li>' + $('.' + pageName).closest('ul').html();
                            $('#leftNavigation').append(listItems);
                            var currentActive = $('.nav ul li ul li.active');
                            if (currentActive != null) 
                                currentActive.removeClass('active');
                                currentActive.closest('ul').closest('li').removeClass('active');
                            
                        

                        else 
                            var directory = document.location.pathname.substring(1, document.location.pathname.lastIndexOf('/'));
                            var dir_name = directory.toLowerCase() + '_main'
                            if (directory != null || '/') 
                                $('.' + dir_name).addClass('active');
                                var content = '<li><div class="sidebar-toggler hidden-phone"></div></li><li><a href="/Default.aspx">Dashboard<i class="icon-"></i></a></li>' + $('.' + dir_name).children('ul').html();
                                $('#leftNavigation').append(content);
                                var currentActive = $('.nav ul li ul li.active');
                                if (currentActive != null) 
                                    currentActive.removeClass('active');
                                    currentActive.closest('ul').closest('li').removeClass('active');
                                
                            
                        
                    
                
            
            else 
                var listItems = '<li><div class="sidebar-toggler hidden-phone"></div></li><li class="active"><a href="/Default.aspx">Dashboard<i class="icon-"></i></a></li>';
                $('#leftNavigation').append(listItems);