load web page into div using jquery
Question
I need help. In my web page, I want that in the div "pagina", would open the link www.google.it when I click on the link without that the page executes the refresh. I've tried doing it this way but it does not work.
<html>
<head>
<title>Home Page</title>
<link rel="stylesheet" href="../jquery-ui-1.11.4.custom/jquery-ui.css">
<script src="../jquery-ui-1.11.4.custom/external/jquery/jquery.js"></script>
<script src="../jquery-ui-1.11.4.custom/jquery-ui.js"></script>
<script type="text/javascript">
$("a").click(function()
{
$("#pagina").load($(this).attr("href"));
return false;
});
</script>
</head>
<body class="body">
<div id="header">
<table border="0" cellspacing="5" cellpadding="5" align="right">
<tr>
<form name="ricerca" method="POST" >
<td><input type="text" name="nome" size="35" placeholder="Cerca Titolo, Attore, Regista, Anno"></td> <!--ENTER -->
<td> <input class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" type="submit" value="Accedi"></td>
</form>
</tr>
</table>
</div>
<br>
<div class="nav">
<table>
<tr>
<td> Categorie:
<ul id="menu">
<li><a href="https://www.google.it">Animazione</a></li>
<li>Avventura</li>
<li>Azione</li>
<li>Commedia</li>
<li>Documentario</li>
<li>Drammatico</li>
<li>Erotico</li>
<li>Fantascienza</li>
<li>Horror</li>
<li>Musical</li>
<li>Romantico</li>
<li>Thriller</li>
<li>Western</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="pagina">
</div>
</body>
</html>
3 answers
solution1
0 2015-05-07 16:46:24
could you use an <iframe></iframe> tag?, or object tag? try looking here http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_iframe
solution2
0 2015-05-07 16:53:47
UPDATE: You would have to use an <iframe> to do that since it is not in the same domain.
You need to prevent the default action of anchor links when they are clicked by calling the event.preventDefault() method before performing the load operation.
$("a").click(function(event)
{
event.preventDefault();
$("#pagina").load($(this).attr("href"));
// return false;
});
solution3
0 2015-05-07 17:11:47
hope it's work for you:
$("a").click(function(event){
event.preventDefault();
var url = $(this).attr('href');
var iframe = '<iframe src="'+url+'"></iframe>';
$("#pagina").html(iframe);
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.