0

我正在做一个流星应用程序。我有一些动态信息框,它们将根据数据库详细信息显示在谷歌地图中。当其中的数据发生变化时,我试图为信息框自定义 div 提供一些 jquery 效果。问题是 jquery 效果功能不起作用,因为似乎 div 元素的创建还没有完全完成,无法正常工作。我尝试使用 setTimeout 和 Meteor.defer,但它仍然无法正常工作。如何克服这种情况?

Template.myTemplate.rendered = function() {

    //some code

    if (!rendered) {

        //map rendering code

        this.rendered = true;

    }

    for (var i = 0; i < count; i++) {

        //some code

        var elem = document.createElement("div"); //custom div to be used in infobox
        elem.id = i+'_div'; // id is dynamic
        elem.innerHTML = '<div><b>' +some_data +'</div>';

        var elemInfoBoxOptions = {
            content: elem,
            disableAutoPan: false,
            maxWidth: 0,
            pixelOffset: new google.maps.Size(-20, 0),
            zIndex: null, boxStyle: {opacity: 1, width: "100px"},
            infoBoxClearance: new google.maps.Size(1, 1),
            visible: true,
            pane: "floatPane",
            enableEventPropagation: false,
            closeBoxURL: ''
        };

        var elemInfobox = new InfoBox(elemInfoBoxOptions);
        elemInfobox.setPosition(new google.maps.LatLng(latitude, longitude));
        elemInfobox.open(map);

        $("#"+i+"_div").effect('highlight', {color: 'red'}, 1000); //Tried putting this code inside setTimeout and Meteor.defer. Did not work.

    }


};

谢谢。

4

2 回答 2

0

据我所知,jQuery 对象似乎没有一个名为“效果”的方法......

于 2013-09-25T04:01:51.110 回答
0

从外观上看,您想突出显示div变量引用的刚刚创建的元素elem,因此请尝试

$(elem ).effect('highlight', {color: 'red'}, 1000);

还要确保在effect调用之前将元素添加到 dom 中。

更新:基于更新的代码

  1. 该元素elem未添加到 dom 树中,您可能必须将其附加到正文中$('body').append(elem)
  2. id 变量elemID没有在循环中更改,导致创建多个具有相同 id 的元素 - 这是无效的
  3. 选择器$("#elemID")是错误的,因为它寻找一个带有 id 的元素,elemID其中 aselemID是一个保存实际 id 的变量,所以它应该是$("#" + elemID)
于 2013-09-25T04:02:10.543 回答