jQuery variable as iframe URL

Question

Why isn't this script working?

$(function() {
    var isbn = $('input').val();
    $('button').click(function() {
        $("#data").html('<iframe height="500" width="1000" src="http://books.google.com/books?vid=ISBN' + isbn + '" />');
    });
});

As you can see, I'm trying to do an extremely simple ISBN lookup field for a demo web site. The script is supposed to take the value of the input and insert it into the URL. Why isn't it working?

Also, is there a better way to accomplish this end?

I realize, of course, that iframes are rubbish, but I just want to keep it simple right now.

What isn't working? If you build the URL as a separate variable and alert() it beforehand, does it show up as you expect? Are you getting an js errors from Firebug (you are using Firebug, right ;)? — brettkelly
– brettkelly, Commented Jun 8, 2009 at 22:10
What exactly is happening? Does ISBN return a value or does the url the IFrame points to not have the GET Parameters at all? — Ballsacian1
– Ballsacian1, Commented Jun 8, 2009 at 22:14

RichieHindle · Accepted Answer · 2009-06-08 22:12:43Z

2

It's not clear when your code gets called, but is this line:

var isbn = $('input').val();

only called once at page-load time, whereas it should be within the click handler:

$('button').click(function() {
    var isbn = $('input').val();
    $("#data").html('<iframe height="500" width="1000" src="http://books.google.com/books?vid=ISBN' + isbn + '" />');
});

answered Jun 8, 2009 at 22:12

RichieHindle

283k49 gold badges367 silver badges408 bronze badges

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

1 Comment

peehskcalba Over a year ago

I knew it was something obvious like that. Thanks!

Richard · Accepted Answer · 2009-06-08 22:12:30Z

0

Why not load the page you wanted to view through the ajax load technique, so fetching the html and displaying it within the element:

$(function() {
    var isbn = $('input').val();
    $('button').click(function() {
        $("#data").load('http://books.google.com/books?vid=ISBN' + isbn);
    });
});

answered Jun 8, 2009 at 22:12

Richard

22.1k13 gold badges64 silver badges102 bronze badges

Comments

Ali · Accepted Answer · 2009-06-08 22:35:57Z

0

the problem is not your code but its the query string you have.

please amend as follows and it should work:

var isbn = "1603038159";

        $("#data").html('<iframe height="500" width="600" src="http://books.google.com/books?as_isbn=' + isbn);

answered Jun 8, 2009 at 22:35

Ali

2531 silver badge4 bronze badges

Collectives™ on Stack Overflow

jQuery variable as iframe URL

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related