Ouverture de deux pages différentes dans deux cadres différents

Question

J'essaie de créer un site Web de cadre, et j'essaie de faire un lien ouvrir une page différente dans deux cadres différents. Donc en gros vous cliquez sur le lien et une page (ie la page d'accueil en fichier .html) s'ouvrira dans l'image 1 qui est le côté gauche, et une autre page (ie un formulaire ou une animation quelconque qui est un fichier .html complètement différent) ouvrirait dans l'image 2 sur le côté droit.

JS et/ou HTML s'il vous plaît. J'ai essayé un autre style JS qui était

$('a.yourlink').click(function(e) { 
    e.preventDefault(); 
    window.open('http://yoururl1.com'); 
    window.open('http://yoururl2.com'); 
}); 

(grâce à Adam Terlson)

ainsi que le codage html:

<a href="#" class="yourlink">Click Here</a> 

bien que je ne sais pas comment cibler différents cadres en la même fenêtre, seulement 2 fenêtres différentes.

Answer 1

Ajouter deux iframes vides dans la page, sur un clic du bouton défini leur attribut src, comme dans cet exemple:

$('a').on('click', function(e) { 
 
    e.preventDefault(); 
 
    $('.iframe1').attr('src', 'http://www.test.com'); 
 
    $('.iframe2').attr('src', 'http://asdf.com/'); 
 
})

iframe { 
 
    width: 49vw; 
 
    float: left; 
 
    height: 100vh; 
 
} 
 
html, body { 
 
    margin: 0; 
 
    padding: 0; 
 
} 
 

 
a { 
 
    background-color: orange; 
 
    color: black; 
 
    position: fixed; 
 
    top: 0; 
 
    left: 0; 
 
    z-index: 9; 
 
    display: block; 
 
    width: 80px; 
 
    padding: 10px; 
 
    text-align: center; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="#">GO</a> 
 
<iframe src="" frameborder="0" class="iframe1"></iframe> 
 
<iframe src="" frameborder="0" class="iframe2"></iframe>