jQuery / Href参数

Question

我正在寻找一种方法，我可以使用一个国家/地区列表...所以当您点击一个链接时，国家/地区代码参数会传递给qjuery，这将返回一个城市列表。

我已经能够使用下拉列表完成所有这些操作，但是想将其更改为a.href链接。

如下所示...

$('#country').click(function(event) {  
// get the countryCode value here
var $country=$("a#country").val();
...

这些需要传递countryCode

<a href="#" id="country">Australia</a>
<a href="#" id="country">United Kingdom</a>
<a href="#" id="country">NewZealand</a>

Answer 1

在html5中最好使用custom attribute：

<a href="#" class="country" data-code="au">Australia</a>
<a href="#" class="country" data-code="uk">United Kingdom</a>
<a href="#" class="country" data-code="nz">NewZealand</a>

在JS中：

$('.country').click(function(event) {  
    var $country = $(this).data('code');
}

Answer 2

将id更改为class并执行：

$(".country").click(function(e) {
    e.preventDefault();
    var country = $(this).text();
});

Answer 3

首先，您不应该有多个具有相同id的项目。

您可以将国家/地区代码存储为数据：

<a href="#" class="country" data-country="aus">Australia</a>

然后检索它：

$('.country').on('click', function(e) {
    e.preventDefault();
    var country = $(this).data('country');
})

Answer 4

<a href="#" class="c" id="country1">Australia</a>
<a href="#" class="c" id="country2">United Kingdom</a>
<a href="#"  class="c" id="country3">NewZealand</a>


$('.c').click(function(event) {  

event.prenventDefault(); 
var $country=$(this).html();
//var $country=$(this).text(); //or you can try this.
//...
});