开发者

Get Image results from Google Image API returning invalid label (jQuery)

So I am trying to show x amount of images from google using the following code, but it keeps returning invalid label. Does anyone have any ideas? thanks in advance for your help.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<div id="google_images"></div>

<script type="text/javascript">
$(document).ready(functio开发者_开发问答n(){
var iURL = "http://ajax.googleapis.com/ajax/services/search/images?v=1.0&q=kufa+castro&format=json&jsoncallback=?";
$.getJSON(iURL,function(json) {
    $(json).each(function() {
        $.each(json.results, function(i,item)
        {    
            //$("#google_images").append(item.unescapedUrl);
            $('#google_images').html();            
        });
    });
});

});


You need to specify jsonp as dataType.

Have a look at this working: http://www.jsfiddle.net/FX79h/2/


Just in case someone sees this, I changed this stuff up. ended up doing it this way: (could do blogs or images - BUT could do any other thing from Google api with some tweeking)

// return values from using Googles Image API

// search types (images,blogs) // for posts (postUrl, titleNoFormatting) // for images (unescapedUrl) function google_search_api($search,$searchType,$count) {

$url = 'http://ajax.googleapis.com/ajax/services/search/'.$searchType.'?v=1.0&q='.urlencode($search).'&filter=1';
if($searchType == "images"){
    //&rsz=large
    $url .="&safe=moderate";
}
$ip=$_SERVER['REMOTE_ADDR'];
$url .="&userip=$ip&rsz=$count&key=".GOOGLE_API;
#echo $url;
$obj = json_decode( file_get_contents($url) );
foreach($obj->responseData->results as $i)
{
    // for images
    if($searchType == "images")
    {
        $source = "/timthumb.php?src=".$i->unescapedUrl."&a=t&h=75&w=75";
        //$source = $i->unescapedUrl;
        if (fopen($i->unescapedUrl, "r")) {
            echo "<li><img src=\"".$source."\" alt=\"".$search."\" width=\"75\" height=\"75\" /></li>";
        }
    }
    // for blogs
    else
    {
        //$title = mb_convert_encoding($i->titleNoFormatting, 'iso-8859-1');
        $title = mb_convert_encoding($i->titleNoFormatting, "ISO-8859-1", "UTF-8");
        echo "<li><a href=\"".$i->postUrl."\" rel=\"external\"/>".$title."</a></li>";
    }
}

} //USE: google_search_api('Jay Z','images','5')


I changed the datatype to jsonp as shown below:

dataType: 'jsonp'

and json.results to json.responseData.results and it worked fine.

I have also used this to update my wordpress blog with relevant image based on the post title.

The code I used is as listed below:

<script type="text/javascript">
$(function(){
var iURL = "http://ajax.googleapis.com/ajax/services/search/images";
$.ajax({
    url: iURL,
    type: 'GET',
    dataType: 'jsonp',
    data: {
        v:  '1.0',
        q:  $(".art-postheader").text(),
        format: 'json',
        jsoncallback:  '?'
    },
    success: callback
});
});

function callback(json){
    $("div.art-postcontent p:eq(2)")
.after("<img src='"
+json.responseData.results[0].unescapedUrl
+"' width='300px' align='left' />");
}
</script>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜