我正在尝试根据 AJAX 请求在 jcarousel 中加载新项目。我有一个不同音乐曲目的列表,在点击事件中我传递了曲目的 ID。
<ul id="itemTrack"> // Track items
<li><a href="#" id="p1">Track 1</a></li>
<li><a href="#" id="p2">Track 2</a></li>
<li><a href="#" id="p3">Track 3</a></li>
<ul>
<ul id="trackList"></ul> // carousel
$("#itemTrack a").bind("click", getSelectedTrack); // Click event bind on the track list
var theModelCarousel = null; // global variable assigned to null
function getSelectedTrack(e){
var el = $(e.currentTarget),
currTrack = el.attr("id"), // Track ID
apiurl = "ServiceLibrary/player/GetTrackList/" + currTrack; // URL to get data
$('#trackList').html(''); // Clear carousel list
if (theModelCarousel != null){theModelCarousel.reset();}
$('#trackList').jcarousel({
vertical : true,
scroll : 5,
initCallback: function(carousel, state){
if (state == 'init') {
theModelCarousel = carousel;
}
getListRequest(carousel, apiurl);
}
});
}
function getListRequest(carousel, apiurl){
$.ajax({
type: "GET",
url : apiurl,
dataType : 'jsonp',
timeout : 8000,
success : function(data){
if(data){
// Add/Create Items HTML
}else{
}
},
error : function(err){
// alert(err);
}
});
};
在上面的代码中,如果我单击列表项,它会将 id(p1) 发送到“apiurl”并获取数据,但是当我第一次单击另一个列表项时,它将发送相同的旧 id(p1) 到ajax 调用,当我第二次单击时,它将发送正确的 id(p2)。我可以理解它会因为 initcallback 而发生,但没有得到任何解决方案来将“apiurl”清除/重置为新值。