Je cherche une solution simple pendant un certain temps. Je veux une page (par exemple http://www.google.com ) à afficher dans une boîte de dialogue JQuery UI la fenêtre. Le plan consiste à ajouter plus tard l'URL de manière dynamique afin que tous les liens de mon site soient affichés dans ladite fenêtre.
J'ai essayé ce qui suit, mais la fenêtre de dialogue est vide lorsque vous cliquez sur le lien. P>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Test</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<script>
$(document).ready(function() {
$('#openwindow').each(function() {
var $link = $(this);
var $dialog = $('<div></div>')
.load($link.attr('href'))
.dialog({
autoOpen: false,
title: $link.attr('title'),
width: 500,
height: 300
});
$link.click(function() {
$dialog.dialog('open');
return false;
});
});
});
</script>
</head>
<body>
<a id="openwindow" href="http://www.google.com">Click me to test.</a>
</body>
</html>
4 Réponses :
Vous pouvez utiliser iframe:
<div id="divId" >
<IFRAME id="iframeId" SRC="" width="" height = "" >
</div>
Vous n'avez pas besoin de Au lieu de cela, vous devez charger le contenu de la propriété En outre, vous semblez utiliser iframe comme vous l'avez été suggéré, mais vous devez lire la documentation sur les boîtes de dialogue ICI . .Open - .Chafe avec un ID - L'ID est censé être unique dans la page. Utilisez la classe à la place.
Vous ne pouvez pas utiliser .charger () si l'URL est dans un autre domaine, en raison de restrictions Ajax à domicile.
Vous pouvez essayer ce code
$(function(){
$('a').on('click', function(e){
e.preventDefault();
$('<div/>', {'class':'myDlgClass', 'id':'link-'+($(this).index()+1)})
.load($(this).attr('href')).appendTo('body').dialog();
});
});
Fondamentalement, vous voulez un appel AJAX l'est?