如何使用jQuery获取clicked元素的ID

Question

我有以下html:

<a href="#" id="#1" class="pagerlink" >link</a>
<a href="#" id="#3" class="pagerlink" >link</a>
<a href="#" id="#2" class="pagerlink" >link</a>
/*etc.... */

和以下jQuery脚本:

$(document).ready(function() {

    var $container = $('.gallery_r').cycle({ 
        fx:     'scrollHorz', 
        speed:   500, 
        timeout: 0 
    }); 

    $('a.pagerlink').click(function() { 
        var id = $(this).attr('id');
        $container.cycle(id); 
        return false; 
    }); 

});

'pagerlink'链接控件是jQuery Cycle幻灯片.如果我交换这一行:

$container.cycle(id); 

为了这

$container.cycle(7); 

它的工作原理......(显然只能导航到7号幻灯片).所以,我的问题是如何获取被点击链接的ID并将其传递到该行？

提前致谢!

Answer 1

您的ID是#1,并且cycle只想传递一个号码.您需要删除#之前的呼叫cycle.

$('a.pagerlink').click(function() { 
    var id = $(this).attr('id');
    $container.cycle(id.replace('#', '')); 
    return false; 
});

此外,ID不应包含该#字符,它无效(数字ID也无效).我建议将ID更改为类似的内容pager_1.

<a href="#" id="pager_1" class="pagerlink" >link</a>

$('a.pagerlink').click(function() { 
    var id = $(this).attr('id');
    $container.cycle(id.replace('pager_', '')); 
    return false; 
});

Answer 2

您只需要从头开始删除哈希:

$('a.pagerlink').click(function() { 
    var id = $(this).attr('id').substring(1);
    $container.cycle(id); 
    return false; 
}); 

Answer 3

@Adam 只需使用 onClick="getId()" 添加一个函数

function getId(){console.log(this.event.target.id)}