Форум

rodiony4 · #1 (**permalink**) 29.05.2017, 23:08

Здравствуйте
Нужно по клику по ссылке, вставить в див - js-код яндекс карты
Так не получилось, пожалуйста, помогите

<script type="text/javascript">
zzz = '<script charset="utf-8" src="https://api-maps.yandex.ru/services/constructor/1.0/js/?sid=vcnFFhOJuYXv6CT5peVIb3cADSfa6GLS&amp;width=600&amp;height=450&amp;lang=ru_RU&amp;sourceType=constructor" type="text/javascript"></script>';
$( "#cap_map" ).click(function() {
		$('.cap_site_map').html(zzz);
});
</script>

<span id="cap_map">показать</span>
<div class="cap_site_map"></div>

j0hnik · #2 (**permalink**) 29.05.2017, 23:17

<head>
	<meta charset="utf-8">
</head>
<body>
	<span id="cap_map">показать</span>
	<div class="cap_site_map"></div>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
	<script>
		var zzz = '<script charset="utf-8" src="https://api-maps.yandex.ru/services/constructor/1.0/js/?sid=vcnFFhOJuYXv6CT5peVIb3cADSfa6GLS&amp;width=600&amp;height=450&amp;lang=ru_RU&amp;sourceType=constructor" type="text/javascript"><\/script>';
		$( "#cap_map" ).click(function() {
		$('.cap_site_map').html(zzz);
	});
</script>
</body>

рони · #3 (**permalink**) 29.05.2017, 23:26

rodiony4,
в документации наверняка есть, более корректные примеры ... но можно так

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
$(function() {
$( "#cap_map" ).click(function() {
    var s = $("<script\>")
    $('.cap_site_map').empty().append(s);
    s.attr({src: "https://api-maps.yandex.ru/services/constructor/1.0/js/?sid=vcnFFhOJuYXv6CT5peVIb3cADSfa6GLS&amp;width=600&amp;height=450&amp;lang=ru_RU&amp;sourceType=constructor"})
});
});
  </script>
</head>

<body>
<span id="cap_map">показать</span>
<div class="cap_site_map"></div>
</body>
</html>

j0hnik · #4 (**permalink**) 29.05.2017, 23:40

Мой саблайм вот на это просто ругался.
constructor" type="text/javascript"></script>

rodiony4 · #5 (**permalink**) 30.05.2017, 00:00

j0hnik, рони, у меня старая библиотека jquery-1.6 и использовать более новую пока не могу (джумла, и многие компоненты, плагины и модули заточены на старую библиотеку)
Есть вариант для jquery-1.6? со старой jquery-1.6 ваш js не выполняется

рони · #6 (**permalink**) 30.05.2017, 00:32

Сообщение от rodiony4

Есть вариант для jquery-1.6?

проще без jquery совсем, но если хочется ...

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
  <script>
$(function() {
$( "#cap_map" ).one("click",function() {
    var s = document.createElement("script");
    $('.cap_site_map')[0].appendChild(s);
    s.src= "https://api-maps.yandex.ru/services/constructor/1.0/js/?sid=vcnFFhOJuYXv6CT5peVIb3cADSfa6GLS&amp;width=600&amp;height=450&amp;lang=ru_RU&amp;sourceType=constructor"

});
});
  </script>
</head>

<body>
<span id="cap_map">показать</span>
<div class="cap_site_map"></div>
</body>
</html>

rodiony4 · #7 (**permalink**) 30.05.2017, 00:47

рони, спасибо! теперь js выполняется, увидел ваш добавленный .one, но наверное можно и так - перед вставкой очищать див - .empty()

Форум

Справочник

Discord чат

Курсы javascript