0

在这里,我有一个创建侧边栏的代码:

var side_bar_html = "<a href='javascript:google.maps.event.trigger(gmarkers[" + parseInt(gmarkers.length - 1) + "],\"click\");'>" + place.name + "</a><br>" + '<div class="raty" />' + "</br>";

$(side_bar_html).appendTo('#side_bar').filter('.raty').raty({
    score : place.rating,
    path : 'http://wbotelhos.com/raty/lib/img'
})

我如何从这段代码创建一个函数来创建一个带有函数的侧边栏......

所以是这样的:

function Create_a_sidebar_and_put_it_into_ID#sidebar () {
//for every marker to return html string
 return "<div class='element'>"+place.name+"</br>"+place.rating+"</div>" + etc...

因为我在创建 html 时遇到问题,我不知道在哪里附加什么,我也没有控制权

可能吗?

4

1 回答 1

1

如果我正确理解您的问题,您是在问如何获取为某个地点创建评级的第一个代码块,并对其进行重构,以便您可以随意为地点创建侧边栏。所以这就是我将如何处理这个答案。

正如@Sime Vidas 所提到的,您可以首先获取创建侧边栏本身的代码并将其设为如下所示的函数。我稍微修改了函数以将 javascript 从href属性中取出(这通常被认为是一种不好的做法),并$.fn.init使用 DOM 方法创建元素替换了将 html 字符串传入(我发现这会急剧降低性能)。您也不需要<br />after 您的a元素,因为divs 默认情况下是块元素。

function createSidebar(place) {
    var $sidebarLink = $(document.createElement('a'));
    var $raty = $(document.createElement('div'));

    $sidebarLink.attr('href', '#').text(place.name).click(function(evt) {
        evt.stopPropagation();
        google.maps.events.trigger(gmarkers[parseInt(gmarkers.length - 1, 10)], 'click');
    });
    $raty.addClass('raty').raty({
        score: place.rating,
        path: 'http://wbotelhos.com/raty/lib/img'
    });
    return $([$sidebarLink, $raty]);
}

现在你可以做类似的事情

var $sidebar = $('#side_bar');
places.map(createSidebar).forEach(function($sidebarPart) { 
    $sidebar.append($sidebarPart);
});

抱歉,如果我无法回答您的问题,但我认为这就是您要问的。如果不能随意发表评论,我们可以讨论更多!

于 2013-09-14T21:19:38.887 回答