JQuery problems w/ attr() changing object

Question

I'm trying to have working JQuery button menu which will change in attribute data, so will autoreload what's inside object parameter, but it don't want to work :(

The code with CSS, HTML and JQuery is in below link

http://jsbin.com/iqukak/2/edit

Anyone can help?

$('button#1').attr("id"){
      $("object#cgi").attr('data','http://www.google.com')};
   $('button#2').attr("id"){
      $("object#cgi").attr('data','http://www.bing.com')};
    $('button#3').attr("id"){
      $("object#cgi").attr('data','http://www.yahoo.com')};
});

Update:

I have uploaded all the files to http://szary.eu/panel/
What I want to achive is:
- when I click on 1 i need 1.html inside <object> visible
- when I click on 2 I need 2.html inside <object> visible

For the beginning fix your "``" And `object parameter` looks to me like an `object tag` — Roko C. Buljan, Nov 25 '12 at 23:00

score 1 · Accepted Answer · edited May 23 '17 at 12:27

1

You can try this code:

$(document).ready(function(){
    $('button#1').click(function() {
      $("object#cgi").attr('data','http://www.google.com')});
   $('button#2').click(function() {
      $("object#cgi").attr('data','http://www.bing.com')});
    $('button#3').click(function() {
      $("object#cgi").attr('data','http://www.yahoo.com')});
});

Although I don't believe Google will let you do this anyway (Bing and Yahoo are fine though) http://jsbin.com/iqukak/15/edit

See this question for why it wont work with Google: how to open google links inside iframe?

edited May 23 '17 at 12:27

Community

1
1

answered Nov 25 '12 at 23:08

Beno

4,633
1
27
26

i've tried your link and it works for Bing and Yahoo. Google will not work - they won't allow it – Beno Nov 25 '12 at 23:15
Hm, I've tried that in Google Chrome @ Windows and it wasn't working, but under Firefox @ Linux it's working ... – Sebastian Szary Nov 25 '12 at 23:42
1

Check out http://stackoverflow.com/questions/4324108/unsafe-javascript-attempt-to-access-frame-with-url Chrome itself is blocking the request because it views it as being unsafe – Beno Nov 25 '12 at 23:54
do You know how I can achieve what I want in google chrome? Because it's starting to be a little frustrating that I can't embed a html site (or rather cgi script will be the destination) inside my html site :-/ @Beno – Sebastian Szary Nov 26 '12 at 00:12
@SebastianSzary you can try use an iframe instead. see here: http://jsbin.com/iqukak/20/edit – Beno Nov 26 '12 at 00:20

Roko C. Buljan · Answer 2 · 2012-11-26T00:25:42.923

1

$(function(){

    $('td.mleft button').click(function(){
      $('#cgi').attr( 'data',   'http://'+ $(this).text().toLowerCase() +'.com' );  
    });

});

And btw: google will never show up and for example if you point to stackoverflow you will be rerouted. So think twice what are you trying to achieve:
cause to prevent "clickjacking", they're sending a HTTP response header called "X-Frame-Options" to prevent pages to be "framed"

EDIT I would discourage you from using <object> tag for that purpose, use .load() instead:

$('#cgi').load( $(this).text() +'.html');

edited Nov 26 '12 at 00:25

answered Nov 25 '12 at 23:11

Roko C. Buljan

196,159
39
305
313

To be honest I want to have working JQuery button menu to change internal pages inside – Sebastian Szary Nov 25 '12 at 23:18
1

you really don't need two jquery libraries: remove ` – Roko C. Buljan Nov 25 '12 at 23:32
Corrected. You can refresh index.html – Sebastian Szary Nov 25 '12 at 23:36
thank You, I have accepted the answer. But still it's not working in Google Chrome for me :( – Sebastian Szary Nov 26 '12 at 00:08
I would highly discourage you from using `object` for that purpose, use the jQuery .load('url') and load your content inside a standard `
` element.
– Roko C. Buljan Nov 26 '12 at 00:21

JQuery problems w/ attr() changing object

2 Answers2