2017-02-12 134 views
-1

我有以下代码结构。它是一套wordpress选项卡。我有很多选项卡遍布网站,使用jquery我想触发一个功能,当用户点击其中一个链接,但我不能应用ID属性,所以我的功能下面不工作......任何建议?jQuery点击链接href属性

JQUERY

$('#1485856532455-70ee0dfe').on('click', function() { 
$('.otherdiv').css('background-image', 'url(http://placehold.it/200x200/ff0000)'); 
}) 

HTML

<ul class="vc_tta-tabs-list"> 
<li class="vc_tta-tab"> 
<a href="#1485856532455-70ee0dfe"> <span class="vc_tta-title-text">Title</span></a> 
</li> 

<li class="vc_tta-tab"> 
<a href="#1485856532489"><span class="vc_tta-title-text">Title</span></a></li> 
</ul> 
+0

https://api.jquery.com/category/selectors/ – Teemu

回答

1

您无法通过ID选择他们,因为他们没有标识。但是你可以使用CSS Atrribute-Equal Selector来获取它们的href属性。像这样:

$('[href="#1485856532455-70ee0dfe"]').on('click', function() { 
    // ... 
} 

更多CSS选择器here

工作代码片段:

$('[href = "#1485856532455-70ee0dfe"]').click(function() { 
 
    alert("#1485856532455-70ee0dfe was clicked! Hoooray!"); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul class="vc_tta-tabs-list"> 
 
    <li class="vc_tta-tab"> 
 
    <a href="#1485856532455-70ee0dfe"> <span class="vc_tta-title-text">Title</span> 
 
    </a> 
 
    </li> 
 

 
    <li class="vc_tta-tab"> 
 
    <a href="#1485856532489"><span class="vc_tta-title-text">Title</span></a> 
 
    </li> 
 
</ul>

+0

我不知道你可以做到这一点..但它仍然没有工作.. – user1673498

+0

@ user1673498你是什么意思不工作?你的意思是它仍然向下滚动到锚? –

0

使用属性选择,那么:

$('[href="#1485856532455-70ee0dfe"]').on('click', function() {....}); 
0

$('#1485856532455-70ee0dfe').on('click', function() { - 意味着页面上我们有ID 1485856532455-70ee0dfe一些元素。在你的HTML代码没有文本1485856532455-70ee0dfe的ID,这就是为什么你的代码不工作。

你有两种情况来解决:

  1. 变化JS添加ID的所需元素$('[href="1485856532455-70ee0dfe"]').on('click', function() {

0

你不能给一个ID,以这样的链接。但是你可以通过做$('[href =“#1485856532455-70ee0dfe”]')。('click',function(){....})来选择与jquery的链接。