\n\n\n\n\n\n![](\"http:\/\/www.containernurseries.co.nz\/images\/contacticon.gif\")
\n\n\n\n\n $.getJSON(\"http:\/\/ip.jsontest.com\", null,\n function (data) {\n console.log(data)\n });\n $(document).ready(function () {\n ($('#a1')).mouseover(function (e) {\n ($('#a1').attr('src', 'http:\/\/www.containernurseries.co.nz\/images\/services.gif'));\n }).mouseout(function (e) {\n ($('#a1')).attr('src', 'http:\/\/www.containernurseries.co.nz\/images\/contacticon.gif');\n });\n });\n\n\n\n<\/code><\/pre>\nYou can see it work here:<\/p>\n
http:\/\/www.sanbarcomputing.com\/flat\/forumPosts\/imgSrcType\/imgSrcTypeNoComments.html<\/p>\n
This code uses a service called “JSONTest” to get properly formatted JSON code. This returns an object (data) of key\/value {ip: “xxx.xxx.xxx.xxx”} which shows your ip address. Here is the services website that I use to get the JSON response:<\/p>\n
http:\/\/teamaqua.github.com\/JSONTest\/<\/p>\n
To see the console log output, just open a console in your browser (hit the F12 key, for instance, or open the FireBug plugin for FireFox. Drill down into the object to see the key\/value pair properly formatted in the console.<\/p>\n
I fixed your code with the scr->src typo fix and some other things needing fixing:<\/p>\n
\n\n\n\n\n\n\n\n\n\n\n $.getJSON(\"http:\/\/www.containernurseries.co.nz\/json\/jsonPlantDetails.php\",\n {plantSelected:\"ARGYRANTHEMUM-POLLY\"},\n function (data) {\n ($('#a1')).attr('src', 'data:image\/jpg;base64,' + data.plantDetail.Image);\n });\n $(document).ready(function () {\n ($('#a1')).mouseover(function (e) {\n ($('#a1').attr('src', 'http:\/\/www.containernurseries.co.nz\/images\/services.gif'));\n }).mouseout(function (e) {\n ($('#a1')).attr('src', 'http:\/\/www.containernurseries.co.nz\/images\/contacticon.gif');\n });\n });\n\n\n\n<\/code><\/pre>\nYou can see it (possibly) fail here:<\/p>\n
http:\/\/www.sanbarcomputing.com\/flat\/forumPosts\/imgSrcType\/imgSrcType.html<\/p>\n
I get a cross-domain error in Chrome, and it seems to fail silently in IE and FireFox:<\/p>\n
\nXMLHttpRequest cannot load http:\/\/www.containernurseries.co.nz\/json\/jsonPlantDetails.php?plantSelected=ARGYRANTHEMUM-POLLY. Origin http:\/\/www.sanbarcomputing.com is not allowed by Access-Control-Allow-Origin.<\/p>\n<\/blockquote>\n
Here is a good post that talks about one way to fix this (changing it to JSONP), but since your server returns JSON, not JSONP, it does not work either (I tried):<\/p>\n
stackoverflow: access-control-allow-origin-not-allowed-by<\/p>\n
You would need to return the result in the form of a JSONP JavaScript executable function from the server, I believe. To get a JSONP request sent, you would change this line:<\/p>\n
$.getJSON(\"http:\/\/www.containernurseries.co.nz\/json\/jsonPlantDetails.php\",\n<\/code><\/pre>\nTo this:<\/p>\n
$.getJSON(\"http:\/\/www.containernurseries.co.nz\/json\/jsonPlantDetails.php?callback=?\",\n<\/code><\/pre>\njQuery then would automatically produce a JSONP request for you. It works, but since the result is not executable JavaScript, you get the following error in Chrome:<\/p>\n
\nUncaught SyntaxError: Unexpected token :<\/p>\n<\/blockquote>\n
Since I think Chrome is trying to execute the JSON as a function, which it is not.<\/p>\n
Changes need to be made to the server, I believe, to get this working cross-domain, if you need that.<\/p>\n
Here is a good article on cross-domain issues:<\/p>\n
https:\/\/developer.mozilla.org\/en-US\/docs\/HTTP_access_control<\/p>\n
Originally posted 2013-11-15 04:22:46. <\/small><\/p>","protected":false},"excerpt":{"rendered":"
There are several problems I found and wrestled with, but finally got some working code: $.getJSON(“http:\/\/ip.jsontest.com”, null, function (data) { console.log(data) }); $(document).ready(function () { ($(‘#a1’)).mouseover(function (e) { ($(‘#a1’).attr(‘src’, ‘http:\/\/www.containernurseries.co.nz\/images\/services.gif’)); }).mouseout(function (e) { ($(‘#a1’)).attr(‘src’, ‘http:\/\/www.containernurseries.co.nz\/images\/contacticon.gif’); }); }); You can see it work here: http:\/\/www.sanbarcomputing.com\/flat\/forumPosts\/imgSrcType\/imgSrcTypeNoComments.html This code uses a service called “JSONTest” to get properly formatted […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1372","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1372","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=1372"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1372\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=1372"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=1372"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=1372"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}