Question

任何人都可以解释为什么这些弹出窗口显示在一起而不是单独显示？

我的意图是弹出窗口仅显示相邻推文悬停的时间。

   var twitterURL = "http://search.twitter.com/search.json?q=%23CM0655";
    function twitterSearch() { // Create the weather function   
        $.ajax({
        url: twitterURL, //http request string for the weather service
        dataType: "jsonp",                                                                                                  
        success: function(JSON) {                      // If successful parse the JSON data
            $('#twitterSearch').html("");
            $.each(JSON.results, function(i,tweet){
                    var tweeterID  = tweet.from_user_id;
                    var dateFormat = tweet.created_at;
                    var newDate    = dateFormat.replace('+0000', '');
                    var title      = 'title="Tweeted from"';
                    var id         = tweet.id;
                    var locData    = tweet.geo;
                    getCordsData(locData);

    $(function() {
    $('#twitterSearch li').hover(function(e) {
        $('div#pop-up').show();

    }, function() {
        $('div#pop-up').hide();
    });

    $('#twitterSearch').mousemove(function(e) {
        $("div#pop-up");
    });

});



                    $('#twitterSearch').append('<li id="tweet' + id + '" class="tweet"><img class="tweetImage" src="'+ tweet.profile_image_url +'" height="35" width="35" /> <a class="tweetLink" href="http://twitter.com/' + tweet.from_user + '" target="_blank">' + tweet.from_user + '</a> on the ' + newDate + ' <br /> tweeted<span id="tweetTextColor">: ' + tweet.text + tweet.geo +'</span></li><div id="pop-up"><p>' + tweet.from_user + '</p><div>');
            });
        //alert("Ajax text");
        setTimeout(twitterSearch, 10000);


        }
        }); // End of ajax
     } // End of function



    function getCordsData(data){
        if(data == null){
            data = "No location data found!";
            //$('#pop-up').append('<p>Cow</p>');
            //alert(data);
        }else{
            var long = data['coordinates'][0];
            var lat = data['coordinates'][1];
            $('#pop-up').html($('#pop-up').html() + "long:" + long + "<br />Lat:" + lat);
            //alert("long:" + long + "Lat:" + lat);
        }
    }

         twitterSearch();

Answer 1

你应该在每个li和$(this).next()的鼠标悬停时使用$(this)来访问每个div＃popup，这是下一个元素是li

DEMO FIDDLE

希望这有帮助

PS：我刚刚编辑了悬停功能，希望你能对其余部分做同样的事情

jQuery弹出窗口分开$ each？

1 个答案: