jQuery load raw image from .php file, how to include

Question

I have a page with some pictures drawn in php. I load a file with the reference-ids. Then the page is done loading, each of the image-elements will be loaded using ajax. (for example ajax_image.php?url=http://www.opti.com/1). Ajax_image then draws a image and outputs it using header jpeg.

The problem is that when I try to "include" or show this picture in my reference-file the output is not a picture, it's text saying: �JPEG

My jQuery looks like this:

$.ajax({
    url: "ajax_picture.php?url="+escape($('#bilde1').attr('rel')),
    cache: false,
    success: function(html){
        $('#bilde1').html(html);
        alert('Picture 1 loaded');
        sizeChangeCallback();
    }
});

I assume I get this problem because I use html to include the picture in the reference-file. But I have no idea what function to use, in order for it to understand that it's a raw picturefile.

Doesn't seem a correct way to solve your problem. What are trying to do? Do you want something like loading an image on demand ? <a onclick="$('<img src="ajax_picture.php?url=\"" + somefunction() + "\" />).insertAfter($(this))">Load a image on click next to this link</a> — Mario César
– Mario César, Commented Nov 6, 2011 at 23:51
So, another thing, the ajax call, will return a HttpResponse to be loaded on the HTML, this is loaded as text for that purpose. You may change to get the src to the image, instead of the content — Mario César
– Mario César, Commented Nov 6, 2011 at 23:53

N Rohler · Accepted Answer · 2011-11-06 23:53:17Z

2

You don't need to use ajax for this. Instead, simply output an <img> tag like this:

var imgTag = '<img src="ajax_picture.php?url=' + escape($('#bilde1').attr('rel')) + '" />';
$('#bilde1').html(imgTag);

answered Nov 6, 2011 at 23:53

N Rohler

4,61526 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Phil Over a year ago

Safer to use the attr() method which will automatically escape any nasty characters

OptimusCrime Over a year ago

ah, brilliant. Let me test that. EDIT: Worked as a sharm, thank you!

Collectives™ on Stack Overflow

jQuery load raw image from .php file, how to include

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related