Question

我正在修改一个wordpress网站，并在滑块左侧有一个带有四个锚标签（按钮）的菜单。当用户选择按钮时，与该按钮关联的幻灯片显示。现在，我想在用户点击按钮时打开一个页面，而不是显示幻灯片。这是迄今为止的代码：

$('#slidernavigation > a').on('click', function(e){

    e.preventDefault();

    $a = $(this);
    $(this).showSlide();    
    if($a.id == $('#slide-1285')){
        console.log('testing');
    }
    else{
        console.log('not-testing');
    }               

});

我在这里测试是否可以点击带有ID＆＃39;＃slide-1285＆＃39;并将其记录到控制台。它总是说不测试＆＃39;。我将为所有ID设置条件，以便将用户重定向到正确的页面。像这样：

$('#slidernavigation > a').on('click', function(e){

    e.preventDefault();


    $(this).showSlide();

    if($a.id == $('#slide-1285')){
        window.location.href = "http://webpage1";
    }

    elseif($a.id == $('#slide-1286')){
        window.location.href = "http://webpage2";
    }           

    elseif($a.id == $('#slide-1287')){
        window.location.href = "http://webpage3";
    }   

    else($a.id == $('#slide-1288')){
        window.location.href = "http://webpage4";
    }           


});

有什么想法吗？提前谢谢。

Answer 1

要获取所单击元素的ID，您可以执行以下操作：

$(this).attr('id');

那将返回一个字符串。所以你可以这样做：

if($(this).attr('id') === 'slide-1285') { do something }

$('#slide-1285')会返回一个jquery元素，但你只需要id。我认为上面的代码更符合您的要求。

Answer 2

您可以为每个链接添加新的data属性，然后获取该值并重定向。

<a data-webpage="http://webpage1" href="whatever" id="slide-123"></a>
<a data-webpage="http://webpage2" href="whatever" id="slide-456"></a>
.....

然后

// this will bind all ids starting with slide-
    $('[id^=slide-]').on('click', function(e){
         // some code.
         window.location.href = $(this).data('webpage');
    }

Answer 3

1）您正在将$a.id（即字符串）与对象$('#slide-1285');进行比较。

2）简化：

＆＃13;

$(document).ready(function(){
	$('.a').click(function(e){
    	e.preventDefault();
      	window.location = $(this).attr('href');
    });
});

＆＃13;

<a href='http://google.com' class='a'>Google!</a><br/>
<a href='http://stackoverflow.com' class='a'>SO!</a><br/>

＆＃13;

Answer 4

jQuery对象没有id属性。您需要执行attr('id')，或者只获取普通DOM对象的id属性。另外，jQuery对象永远不会相互平等。第三，您想要检查被点击的元素是否具有某个ID，这可以使用.is()来完成。

总之，你可以做其中一个：

比较字符串：

$('#slidernavigation > a').on('click', function(e){

   if(this.id == '#slide-1285'){
        console.log('testing');
    }

    else{
        console.log('not-testing');
    }               

});

使用.is()：

$('#slidernavigation > a').on('click', function(e){

   if($(this).is('#slide-1285')){
        console.log('testing');
    }

    else{
        console.log('not-testing');
    }               

});

或者，让浏览器做它的事情。提供<a> href个属性，即使没有JS，它们也可以作为链接使用。

Answer 5

而不是写$ .id

你应该写

 $a.attr('id')

这应该像这样检查： -

 if( $a.attr('id') == slide-1285)

不是你的方式：）

Answer 6

尝试

var pages = [{"slide-1285" : "http://webpage1"}
             , {"slide-1286" : "http://webpage2"}
             , {"slide-1287" : "http://webpage3"}
             , {"slide-1288" : "http://webpage4"}
            ];

$('#slidernavigation > a').on('click', function(e) {
    e.preventDefault();
    var nav = e.target.id;
    $.grep(pages, function(page) {
        if (nav in page) {
            window.location.href = page[nav];
        }
    })
});

jsfiddle http://jsfiddle.net/guest271314/2nf97dfr/

Answer 7

<div id="a">
    dhjdfd
</div>



   $('#a').on('click',function(e){ 
       var clickedElement= e.srcElement; 
        if($(clickedElement).attr("id") == "abc"){
         //do something   
        } 
    });

只需使用e.srcElement获取元素引用然后获取其id ..并且顺便说一句，你可以使用switch case而不是if if语句。

工作小提琴link

打开基于$（this）选择器的页面

7 个答案: