javascript - Javascript 点击链接

Question

我在 jQuery.Script 上有“tabslideout”：

$(function(){
    $('.slide-out-div').tabSlideOut({
        tabHandle: '.handle',                            
        pathToTabImage: '/images/contact.gif',       
        imageHeight: '122px',                              
        imageWidth: '40px',                                 
        tabLocation: 'left',                              
        speed: '300',                                       
        action: 'click',                                  
        topPos: '200px',                                   
        fixedPosition: true                               
    });
});

我想通过单击链接打开此选项卡，例如<a href="">Some Text</a> 我该怎么做？

Answer 1

给链接一个 id，像这样：

<a href="" id="some-id">Some Text</a>

然后使用此代码：

$(function() {
    $('#some-id').on('click', function(e) {
        e.preventDefault();
        $('.slide-out-div').tabSlideOut({
            tabHandle: '.handle',                            
            pathToTabImage: '/images/contact.gif',       
            imageHeight: '122px',                              
            imageWidth: '40px',                                 
            tabLocation: 'left',                              
            speed: '300',                                       
            action: 'click',                                  
            topPos: '200px',                                   
            fixedPosition: true                               
        });
    });
});

Answer 2

为了使您的代码更清晰，请将 tabSlideout 选项和滑动 div 存储在单独的变量中：

var tabOptions = {
    tabHandle: '.handle',                            
    pathToTabImage: '/images/contact.gif',       
    imageHeight: '122px',                              
    imageWidth: '40px',                                 
    tabLocation: 'left',                              
    speed: '300',                                       
    action: 'click',                                  
    topPos: '200px',                                   
    fixedPosition: true                               
};

var slider = $('.slide-out-div');

接下来，以某种方式识别您的链接。类通常比 ID 好：

<a href="" class="tabLink">Some Text</a>

最后添加一个点击处理程序：

$('.tabLink').on('click', function(evnt) {
    evnt.preventDefault();
    slider.tabSlideOut(tabOptions);
});