Плагин jQuery UI tabs, внешняя ссылка

394

31 января 2017, 20:21

Почему не работает внешняя ссылка на другие сайты?

$(document).ready(function(){ 
 
    $('#cont').tabs(); 
     
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
<div id="cont"> 
     <ul> 
         <li><a href="https://www.yandex.ru/">Первая</a></li> 
         <li><a href="https://www.yandex.ru/">Третья</a></li> 
     </ul> 
 </div>

Answer 1

Просто табс вешает свои условия на элементы. Так это работает:

$(document).ready(function(){ 
    $('#cont').tabs(); 
    $('#cont a').on("click",function(){ 
    	$('#frame').src = $(this).attr('href'); 
    }) 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
   <script 
		  src="http://code.jquery.com/ui/1.12.0/jquery-ui.min.js" 
		  integrity="sha256-eGE6blurk5sHj+rmkfsGYeKyZx3M4bG+ZlFyA7Kns7E=" 
		  crossorigin="anonymous"></script> 
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" media="screen" /> 
<div id="cont"> 
     <ul> 
         <li><a href="https://www.yandex.ru/">Первая</a></li> 
         <li><a href="https://www.yandex.ru/">Третья</a></li> 
     </ul> 
  <iframe width="400" height="400" name="panel" id="frame"></iframe> 
 </div>

Answer 2

Потому что CORS, а точнее Same Origin Policy не позволит получить данные с чужого сайта.

Можно попытаться использовать iframe'ы, но серьёзные сайты и это не позволят.