My iFrame looks like this:
<iframe id="iframe" name="iframe1" frameborder="0" src=""></iframe>
And my script looks like this:
<script type="text/javascript">
$(document).ready(function() {
$('#iframe').attr('src',http://google.com);
})
</script>
I've also tried putting quotes around the url:
<script type="text/javascript">
$(document).ready(function() {
$('#iframe').attr('src','http://google.com');
})
</script>
But neither is working.
What am I missing?
If you look at the browser's error console, you'll see the real problem:
Refused to display 'https://www.google.com/' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.
Google doesn't let you do that.
<script type="text/javascript">
$(document).ready(function() {
$('#iframe').attr('src', 'http://google.com');
})
</script>
Quotes missing on the url.
You're not allowed to load www.google.com in an iFrame. Try it with another url.
Load denied by X-Frame-Options: https://www.google.com/ does not permit cross-origin framing.
$("#iframe").attr("src","your url");
this will work fine.
Just call the function with Iframe name and desired url
function loadIframe(iframeName, url) {
var $iframe = $('#' + iframeName);
if ( $iframe.length ) {
$iframe.attr('src',url);
return false;
}
return true;
}
Ex:
loadIframe("iframe1","http://yahoo.com");
Related
If a specific <div id='credits'> is removed from the HTML document, I want it the user to be redirected to a new web page using JavaScript.
For example:
<div id="credits"></div>
If someone removes it then users will be automatically redirected to my website.
This is to protect copyrights.
If I understand you are worried about someone copying your page to their website, you can try this, though it is indeed absurdly easy to get around:
<script type="text/javascript">
if($('#credits').length == 0)
window.location = 'http://www.url.com'
</script>
in your page load event you may check like following:
$(document).ready(function(){
var yourDiv=document.getElementById("credits");
if(yourDiv===null || yourDiv===undefined)
window.location="http://www.google.com";
});
or
window.onload=function(){
var yourDiv=document.getElementById("credits");
if(yourDiv===null || yourDiv===undefined)
window.location="http://www.google.com";
}
Try this:
<script type="text/javascript">
$(document).ready(function(){
if($("#your-div-id").length == 0) {
window.location.href = "your-url";
}
});
</script>
I have a <div id="content">. I want to load the content from http://vietduc24h.com into my div:
<html>
<head>
<script type="text/javascript">
$(document).ready(function()
{
$("#content").attr("src","http://vietduc24h.com");
})
</script>
</head>
<body>
<div id="content"></div>
</body>
</html
I don't want to use an iframe. How can I do this?
You need to think about CORS in this aspect. The code you need to have is:
<script type="text/javascript">
$(document).ready(function()
{
$("#content").load("http://vietduc24h.com");
})
</script>
When your domain is not inside vietduc24h.com, you might get some security exception. In order to avoid that, you can host a local proxy here. In PHP, we do this way (url.php):
<?php
$url = file_get_contents(urlencode($_GET["url"]));
echo $url;
?>
And in the script, you need to modify this way:
<script type="text/javascript">
$(document).ready(function()
{
$("#content").load("proxy.php?url=http://vietduc24h.com");
})
</script>
Try this code with the jQuery Load function:
$('#content').load('http://vietduc24h.com', function() {
alert('Load was performed.');
});
If you encounter in security issues because of the Cross-Origin-Resource-Sharing policy than you have to use a proxy in your server code.
Try this:
$("#content").html('<object data="http://vietduc24h.com">');
Taken from this answer.
I have an iframe on my page where you can checkout my latest web development pages, and so on. Is it possible to refresh it with regular JavaScript or jQuery?
<iframe src="projektit" style="width:100%; height:400px; border:none;" id="iframe"></iframe>
I'm thinking about something like this.
$.ajax({
url: "../",
success: function (data) {
$("#iframe").html(data);
}
});
Any ideas?
<iframe id="homepage" frameborder="1" width="400" height="300" src="http://jbcurtin.com/"></frame>
<script>
var frame=$("#homepage")
frame.attr('src',frame.attr('src'))
// None jquery:
var frame=document.getElementById('homepage')
frame.src=frame.src;
</script>
http://jsfiddle.net/ekpAm/
jsFiddle
To refresh an iframe I would suggest just changing the src value.
Changing the src value will trigger the iframe to refresh.
$('#iframe').prop('src', url);
If you notice it's not refreshing, you could always attach a bogus query string value to the end of the url in the case of it being cached.
var q = new Date(); // use current date obj as query string value
$('#iframe').prop('src', url + '?q=' + q.getTime());
I am using below mentioned script to get href of new opened window, but its not working
Browser FF 7, IE 9, WIN 7
Can someone please let me know what's wrong in the script
Thanks in Advance
Akhil
<html>
<head>
<script type="text/javascript">
function open_win()
{
var mywindow=window.open("http://thesun.co.uk");
var clbutton=document.createElement("button");
var par=document.getElementById("main");
clbutton.setAttribute("id","focus");
clbutton.setAttribute("value","CLICK");
clbutton.innerHTML="CLICK";
par.insertBefore(clbutton,null);
clbutton.onclick=function() {alertMsg(mywindow);}
}
function alertMsg(mywindow)
{
mywindow.focus();
var t=mywindow.location.href;
alert(t);
//mywindow.alert("testing");
mywindow.close();
}
</script>
</head>
<body onload="open_win()">
<p id="main"></p>
</body>
</html>
You can't get the URL of sites that are in a different domain or protocol as the script that you are running. It is due to cross-domain restrictions. Chrome gives you the following error:
Unsafe JavaScript attempt to access frame with URL http://www.thesun.co.uk/sol/homepage/ from frame with URL http://fiddle.jshell.net/_display/. Domains, protocols and ports must match.
I think that it might be because the variable is not set yet. I think you might need a callback to say that the dom is ready for the new window.
I am trying to send get requests to the Google Places API with this code:
<script type="text/javascript" src="json2.js">
var googleQuery;
function load() {
googleQuery = JSONRequest.get(
"https://maps.googleapis.com/maps/api/place/details/json?reference=3af0d044d45cd8587d9a3522bc98a95d4f60c6a8&sensor=true&key=xxxxxxxxxxxxxxxx",
function (googleQuery, value, exception) {
if (value) {
processResponse(value);
}
else {
processError(exception);
}
}
);
}
</script>
And calling the load function in the body onload.
<body onload="load()">
</body>
I am including the src="json2.js" in this <script> instead of in its own <script>, since I was getting a "JSONRequest is undefined" error...but I am still getting a strange "load is undefined" error.
Am I going about this JSON request correctly?
Try:
<script type="text/javascript" src="json2.js"></script>
<script type="text/javascript">
var googleQuery;
function load(){
googleQuery = JSONRequest.get(
"https://maps.googleapis.com/maps/api/place/details/json?reference=3af0d044d45cd8587d9a3522bc98a95d4f60c6a8&sensor=true&key=xxxxxxxxxxxxxxxx",
function (googleQuery, value, exception) {
if (value) {
processResponse(value);
} else {
processError(exception);
}
}
);
}
</script>
You can't have JavaScript code inside a script tag which has the src attribute. You should place the inline code on another script tag, otherwise it won't be executed.
Replace the line :
<script type="text/javascript" src="json2.js">
with
<script type="text/javascript" src="json2.js"></script>
<script>
Your JS code is being ignored since you specified an src attribute.
JSONRequest is more so just a proposal which browsers can implement at their will (I think Firefox does).
I'm not sure if there are any libraries that can be script sourced to in order to use JSONRequest, but an alternative is to use flyJSONP (http://alotaiba.github.com/FlyJSONP/#!/demo).
flyJSONP uses YQL (Yahoo Query Language) to do any cross domain post/get, and I highly recommend it (especially for google api's such as oAuth 2.0 and ClientLogin)... and it has a debugger mechanism.
Also, there is jankyPost (http://saunter.org/janky.post/). I have not used it but I'm sure I will and I like its concept. Its kinda clugy, or well... janky... but read about how it works (short paragraph) and you'll love it and want to build you own perhaps.
--Cody