输出HTLM5数据属性中对象的所有值

Question

为什么以下代码只输出下面HTML代码中的两个值中的第一个？

JS

var airportOptions = $.each($(".entry-listing").data("airports"), function(k,v) {
        console.log(v); 
    });

HTML

<div class="entry-listing" data-airports="{ "LHR": "London Heathrow", "LHR":"London Gatwick" }">

Answer 1

关键的LHR使用了两次：

{ "LHR": "London Heathrow", "LHR":"London Gatwick" }

对象中的键应该是唯一的，例如：

{ "LHR": "London Heathrow", "LGW":"London Gatwick" }

使用html：

<div class="entry-listing" data-airports='{ "LHR": "London Heathrow", "LGW":"London Gatwick" }'></div>

和js

$.each($(".entry-listing").data("airports"), function (k, v) {
    console.log(v);
});

Answer 2

这是工作代码 -

<强> Fiddle

var airportOptions = $.each($(".entry-listing").data("airports"), function(k,v) {
       congsole.log(v); 
    });