在回發中停止JQuery Slide-in

Question

我正在使用jQuery滑塊將div滑入和滑出的asp.net網頁上。該div包含三個asp下拉列表，其值由服務器端VB中的頁面加載例程初始化。在第一個下拉列表中，我希望具有自動回覆功能，因此取決於所選的項目，第二個下拉列表會反彈。

不幸的是，當觸發autopostback時，整個div滑回到它的起始位置，儘管將div滑回屏幕上，我可以看到autopostback例程工作並反彈第二個下拉菜單。

是否有任何阻止div滑回其起始位置除非單擊了手柄按鈕？

我使用jquery.tabSlideOut.v1.3.js，但我已經複製並粘貼下面如有利用其：

(function($){ 
$.fn.tabSlideOut = function(callerSettings) { 
    var settings = $.extend({ 
     tabHandle: '.handle', 
     speed: 300, 
     action: 'click', 
     tabLocation: 'right', 
     topPos: '1px', 
     leftPos: '20px', 
     fixedPosition: false, 
     positioning: 'absolute', 
     pathToTabImage: null, 
     imageHeight: null, 
     imageWidth: null, 
     onLoadSlideOut: true      
    }, callerSettings||{}); 

    settings.tabHandle = $(settings.tabHandle); 
    var obj = this; 
    if (settings.fixedPosition === true) { 
     settings.positioning = 'fixed'; 
    } else { 
     settings.positioning = 'absolute'; 
    } 

    //ie6 doesn't do well with the fixed option 
    if (document.all && !window.opera && !window.XMLHttpRequest) { 
     settings.positioning = 'absolute'; 
    } 

    //set initial tabHandle css 

    if (settings.pathToTabImage != null) { 
     settings.tabHandle.css({ 
     'background' : 'url('+settings.pathToTabImage+') no-repeat', 
     'width' : settings.imageWidth, 
     'height': settings.imageHeight 
     }); 
    } 

    settings.tabHandle.css({ 
     'display': 'block', 
     'textIndent' : '-99999px', 
     'outline' : 'none', 
     'position' : 'absolute' 
    }); 

    obj.css({ 
     'line-height' : '1', 
     'position' : settings.positioning 
    }); 

    var properties = { 
       containerWidth: parseInt(obj.outerWidth(), 10) + 'px', 
       containerHeight: parseInt(obj.outerHeight(), 10) + 'px', 
       tabWidth: parseInt(settings.tabHandle.outerWidth(), 10) + 'px', 
       tabHeight: parseInt(settings.tabHandle.outerHeight(), 10) + 'px' 
      }; 

    //set calculated css 
    if(settings.tabLocation === 'top' || settings.tabLocation === 'bottom') { 
     obj.css({'left' : settings.leftPos}); 
     settings.tabHandle.css({'right' : 0}); 
    } 

    if(settings.tabLocation === 'top') { 
     obj.css({'top' : '-' + properties.containerHeight}); 
     settings.tabHandle.css({'bottom' : '-' + properties.tabHeight}); 
    } 

    if(settings.tabLocation === 'bottom') { 
     obj.css({'bottom' : '-' + properties.containerHeight, 'position' : 'fixed'}); 
     settings.tabHandle.css({'top' : '-' + properties.tabHeight}); 

    } 

    if(settings.tabLocation === 'left' || settings.tabLocation === 'right') { 
     obj.css({ 
      'height' : properties.containerHeight, 
      'top' : settings.topPos 
     }); 

     settings.tabHandle.css({'top' : 0}); 
    } 

    if(settings.tabLocation === 'left') { 
     obj.css({ 'left': '-' + properties.containerWidth}); 
     settings.tabHandle.css({'right' : '-' + properties.tabWidth}); 
    } 

    if(settings.tabLocation === 'right') { 
     obj.css({ 'right': '-' + properties.containerWidth}); 
     settings.tabHandle.css({'left' : '-' + properties.tabWidth}); 

     $('html').css('overflow-x', 'hidden'); 
    } 

    //functions for animation events 

    settings.tabHandle.click(function(event){ 
     event.preventDefault(); 
    }); 

    var slideIn = function() { 

     if (settings.tabLocation === 'top') { 
      obj.animate({top:'-' + properties.containerHeight}, settings.speed).removeClass('open'); 
     } else if (settings.tabLocation === 'left') { 
      obj.animate({left: '-' + properties.containerWidth}, settings.speed).removeClass('open'); 
     } else if (settings.tabLocation === 'right') { 
      obj.animate({right: '-' + properties.containerWidth}, settings.speed).removeClass('open'); 
     } else if (settings.tabLocation === 'bottom') { 
      obj.animate({bottom: '-' + properties.containerHeight}, settings.speed).removeClass('open'); 
     }  

    }; 

    var slideOut = function() { 

     if (settings.tabLocation == 'top') { 
      obj.animate({top:'-3px'}, settings.speed).addClass('open'); 
     } else if (settings.tabLocation == 'left') { 
      obj.animate({left:'-3px'}, settings.speed).addClass('open'); 
     } else if (settings.tabLocation == 'right') { 
      obj.animate({right:'-3px'}, settings.speed).addClass('open'); 
     } else if (settings.tabLocation == 'bottom') { 
      obj.animate({bottom:'-3px'}, settings.speed).addClass('open'); 
     } 
    }; 

    var clickAction = function(){ 
     settings.tabHandle.click(function(event){ 
      if (obj.hasClass('open')) { 
       slideIn(); 
      } else { 
       slideOut(); 
      } 
     }); 

    }; 

    if (settings.action === 'click') { 
     clickAction(); 
    } 

    if (settings.action === 'hover') { 
     hoverAction(); 
    } 

    if (settings.onLoadSlideOut) { 
     slideOutOnLoad(); 
    }; 

}; 
})(jQuery); 

的下拉菜單中，我滑的股利...

<asp:DropDownList ID="ddContinent" AutoPostBack="true" runat="server"> 
       <asp:ListItem>ALL</asp:ListItem> 
       <asp:ListItem>Africa</asp:ListItem> 
       <asp:ListItem>Americas</asp:ListItem> 
       <asp:ListItem>Asia</asp:ListItem> 
       <asp:ListItem>Europe</asp:ListItem> 
</asp:DropDownList> 

<asp:DropDownList ID="ddCountry" runat="server"> 
</asp:DropDownList> 

ddCountry被初始化在頁面加載和我根據在第一下拉使用在服務器側VB一個ddContinent.SelectedIndexChanged型功能選擇的大陸重新綁定。澄清 - 這一點工作。我試圖制定出如何在觸發自動回發後停止DIV滑回視圖

任何想法？

編輯：我還沒有找到一個明確的答案，但翻看網頁，一個選項可能是使用按鈕單擊來激活滑塊，而不是「a」鏈接。那麼可能使用cookie或標籤來存儲div是否可見。該值可以通過單擊按鈕單擊進行更新，並且是滑動條滑動的條件。

Answer 1

我使用C＃，而不是VB.Net但這應該幫助：

.ASPX

<asp:DropDownList ID="ddContinent" AutoPostBack="true" OnSelectedIndexChanged ="UpdateCountry" runat="server"> 

代碼隱藏：

Private Sub UpdateCountry(ByVal sender As Object, _ 
     ByVal e As System.EventArgs) 
    // update countries 
    End Sub