Javascript 在谷歌地图上调用Jquery accordion只运行一次
所以我创建了一个GoogleMaps页面,其中包含一组由XML生成的标记。其思想是,当您单击一个标记时,将生成一个div,显示与该标记相关的事件信息。这一切都很好,但我现在正在努力的是,试图将一个手风琴附加到事件信息上。到目前为止,我的代码将在您单击的第一个标记上显示一个手风琴,可以是任何一个,它返回正确的信息,显示div,并有一个手风琴,但在任何后续的标记单击上都没有,即使是第二次单击也没有相同的手风琴 我相信这一定是一个简单的修复,但我已经尝试了一些变体,在手风琴上有三次尝试,我留下来展示不同的版本,我得到了相同的结果 下面是将事件绑定到标记的代码,作为google事件侦听器Javascript 在谷歌地图上调用Jquery accordion只运行一次,javascript,jquery,google-maps,jquery-ui-accordion,Javascript,Jquery,Google Maps,Jquery Ui Accordion,所以我创建了一个GoogleMaps页面,其中包含一组由XML生成的标记。其思想是,当您单击一个标记时,将生成一个div,显示与该标记相关的事件信息。这一切都很好,但我现在正在努力的是,试图将一个手风琴附加到事件信息上。到目前为止,我的代码将在您单击的第一个标记上显示一个手风琴,可以是任何一个,它返回正确的信息,显示div,并有一个手风琴,但在任何后续的标记单击上都没有,即使是第二次单击也没有相同的手风琴 我相信这一定是一个简单的修复,但我已经尝试了一些变体,在手风琴上有三次尝试,我留下来展示不
function bindEvents(marker, id, venueName, website){
google.maps.event.addListener(marker, 'click', function(){
// TARGET and show eventsFeed on click
$('#eventsFeed').show(222);
var eventsList = document.getElementById('eventsList');
// ADDS styles to the events feed divs when created
// DECLARED here for the inclusion of the venueName & website as feedhead
// even when no events are present
var venueNameDiv = "<div class='venueNameFeed'>";
var webSiteDiv = "<a target='_blank' class='websiteInFeed' href='http://"+website+"'><span class='fa fa-home'></span></a>";
var titleInFeed = "<div class='"+id+" eventTitleFeed'>";
var accordDataWrap = "<h2 class='accordWrap>";
var eventInFeed = "<div class='eventDescFeed'>";
var dateInFeed = '<div class="eventDateFeed">';
var priceInFeed = "<div class='eventPriceFeed'>";
// CLOSE the divs after each entry
var divBrk = "</div>";
var closeAccordDataWrap = "</h2>";
var feedHead = venueNameDiv + venueName + divBrk;
// EMPTY array to line up matched events in
var eventsLine = [];
// CYCLE through eventsArray
for (var key in eventsArray){
var eventLoop = eventsArray[key];
// MATCH id to venue_id
var venue_id = eventLoop.venue_id;
if (venue_id == id){
// ONLY show events from todays date onward
var now = new Date();
var date = new Date(eventLoop.eventDATE);
// SET hours to 0 to ignore time part (always as 01:00:00 for event date?)
now.setHours(0,0,0,0);
if (date >= now){
//ADD all matched events to eventsLine array
eventsLine.push(titleInFeed + eventLoop.eventTitle + divBrk +
accordDataWrap + eventInFeed + eventLoop.event + divBrk +
dateInFeed + formatDate(eventLoop.eventDATE) + divBrk +
priceInFeed + "£" + eventLoop.price + divBrk + closeAccordDataWrap);
}
}
}
// TURNS the array into a string and replaces those damned, infernal commas!!
var outputString = eventsLine.toString().replace(/>,/g, '>');
// PUT the compiled array into the eventsFeed div (with venueName as title)
if (website==""){
eventsList.innerHTML = feedHead + outputString;
} else {
eventsList.innerHTML = feedHead + webSiteDiv + outputString;
}
// ADD the accordion
$(document).on('click', marker, function(){
$(eventsList).accordion({
header: "div."+id,
icons: null
})
})
//或
accordion(eventsList, id);
});
}
第三个选项调用一个单独的函数,该函数定义为:
function accordion(placement,id){
$(placement).accordion({
header: "div."+id,
icons: null
});
}
正如你可能知道的那样,我对所有这些都很陌生,因此任何帮助或建议都将不胜感激 您能否替换此代码:
$(eventsList).each(function(){
$(eventsList).accordion({
header: "div."+id,
icons: null
});
});
$(eventsList).each(function(){
$(this).accordion({
header: "div."+id,
icons: null
});
});
使用此代码:
$(eventsList).each(function(){
$(eventsList).accordion({
header: "div."+id,
icons: null
});
});
$(eventsList).each(function(){
$(this).accordion({
header: "div."+id,
icons: null
});
});
试试看。另外,如果你能为你的代码做些修改,那会更好