Question

以下是我使用的代码，该代码定位所有同页#链接。

$('a[href*=\\#]').on('click', function(event){     

// code here

});

但是我的页面上的三个元素中有一个在点击功能上不需要这个。

我要指定的两个是#about-us和#top

我已尝试专门定位它们，并使用逗号分隔符，例如

$('$about-us,#top').on('click', function(event){

但这不正确。

如何修改此代码以定位特定链接（或id s）？

Answer 1

好吧，只需堆叠那些属性选择器：

$("a[href='#about-us'], a[href='#top']").on('click', function(event){

这是一个演示

＆＃13;

$("a[href='#about-us'], a[href='#top']").on('click', function(event){  

    event.preventDefault();
    console.log( this.hash );

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<ul>
<li><a href="#about-us">About</a></li>
<li><a href="#top">Top</a></li>
<li><a href="javascript:;">Contact (will not log)</a></li>
</ul>

＆＃13;

如果您需要if / else ... - 您可以浏览 more magic

＆＃13;

// Target all hash anchors...
$("a[href^='#']").on('click', function(event){  

    event.preventDefault();
    var hash = this.hash.substr(1); // remove "#"

    if(hash && hash.match(/^(about-us|top)$/)) {
      console.log("MATCHES "+ hash);
    } else {
       console.log("This anchor is not in the matching group!");
    }

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<ul>
<li><a href="#home">STRANGE UP ARROW ICON</a></li>
<li><a href="#about-us">About</a></li>
<li><a href="#top">Top</a></li>
<li><a href="#contact">Contact</a></li>
</ul>

＆＃13;

Answer 2

这可以通过以下方式实现....

    $('#id1, #id2').on('click', some_function);

定位多个特定ID，Anchor散列元素 - 用于jQuery onclick函数

2 个答案: