Артём Мáлков

Отложенное выполнение скрипта через N секунд на JavaScript

11 окт8 комм

Продолжая тему регулярного выполнения скрипта в заданные промежутки времени, сегодня я расскажу вам, как можно просто сделать отложенное (через n-е количество времени) выполнение вашего скрипта.

Итак, всю вашу конструкцию (код) можно поместить в скрипт:

setTimeout(function() {

	// Ваш код

}, 2000);

В этом случае функция анонимна. Но есть вариант и с использованием некой функции:

function test() {

	// Ваш код

}

setTimeout(test, 2000);

В обоих вариантах 2000 – это время, равное двум секундам. Именно через это время, после загрузки страницы, и произойдет выполнение вашего скрипта.

Рекомендуем к просмотру
Как определить время выполнения PHP-скрипта?
Статьи и советы
Выполнение (запуск) скрипта после загрузки страницы на jQuery/JavaScript
Посты
Регулярное выполнение скрипта каждые N секунд на JavaScript
Статьи и советы
8
комментариев
Форма комментирования этого поста скрыта. Авторизуйтесь, чтобы расширить привилегии гостевого посещения и получить необходимую помощь от сообщества Pandoge.
    • 0
    30
      •  Проверенный
    20 ноя в 09:51

    Добрый день!

     <script>	setTimeout(function() {
    !function(){function o(o){var t=document.getElementById(o);t&&(t.style.display="none")}function t(o){for(var t=document.querySelectorAll("."+o),i=0;i<t.length;i++)t[i].style.display="none"}function i(o,t){var i="https:"===window.location.protocol?"https:":"http:";return i+"//widgets.2gis.com/widget?type="+o+"&options="+encodeURIComponent(JSON.stringify(t))}function r(o){if(!o.src)return"";var t=o.borderColor?"1px solid "+o.borderColor:"none";return'<iframe frameborder="no" style="border: '+t+'; box-sizing: border-box;" width="'+o.width+'" height="'+o.height+'" src="'+o.src+'"></iframe>'}window.DG=window.DG||{},DG.Widget=DG.Widget||{},DG.Widget.Components=DG.Widget.Components||{},window.DGWidgetLoader=function(n){t("dg
    -widget-link"),o("firmsonmap_biglink"),o("firmsonmap_biglink_photo"),o("firmsonmap_biglink_route"),n=n||{},n.org=n.org||[],n.pos=n.pos||{},n.opt=n.opt||{};var e=n.width||900;e=e.toString(),"%"!=e.slice(-1)&&(e=parseInt(e,10),e=Math.min(1200,e),e=Math.max(500,e));var d=n.height||600;d=d.toString(),"%"!=d.slice(-1)&&(d=parseInt(d,10),d=Math.min(1e3,d),d=Math.max(400,d));for(var s=n.borderColor||"#a3a3a3",a="",g=0;g<n.org.length;g++)n.org[g].id&&(a+=n.org[g].id+",");a=a.slice(0,-1);var p={pos:n.pos,opt:n.opt,org:a};document.write(r({width:e,height:d,borderColor:s,src:i("firmsonmap",p)}))},DG.Widget.Components.Loader=function(t){o("2gis_mini_biglink");var n,e,d=700,s=400,a=t.resize;a?(n=a.w?parseInt(a.w,10):d,e=a.h?parseInt(a.h,10):s):(n=d,e=s),document.write(r({width:n,height:e,src:i("mini",t)}))}}(); }, 2000); </script>

    Вроде так отложил загрузку карты или скрипта

    Но карта не загружается. Это карта от 2gis, ссылка на скрипт https://widgets.2gis.com/js/DGWidgetLoader.js

      • 0
      30
        •  Проверенный
      20 ноя в 09:52

      Sergey, я правильно вообще сделал?

      Подскажите пожалуйста

      • 0
      1067
        •  Команда Pandoge
      изменено 20 ноя в 23:42

      Sergey, здравствуйте!

      Можете показать код, который предоставляет 2gis?

      • 0
      30
        •  Проверенный
      21 ноя в 17:57

      Артём Мáлков,

        <div class="contact-map">
              <a class="dg-widget-link" href="http://2gis.kz/almaty/firm/70000001024028702/center/76.90487623214723,43.24038837587517/zoom/16?utm_medium=widget-source&utm_campaign=firmsonmap&utm_source=bigMap">Посмотреть на карте Алматы</a>
              <div class="dg-widget-link"><a href="http://2gis.kz/almaty/firm/70000001024028702/photos/70000001024028702/center/76.90487623214723,43.24038837587517/zoom/17?utm_medium=widget-source&utm_campaign=firmsonmap&utm_source=photos">Фотографии компании</a></div>
              <div class="dg-widget-link"><a href="http://2gis.kz/almaty/center/76.905122,43.239298/zoom/16/routeTab/rsType/bus/to/76.905122,43.239298╎Алматинские Ортопедические Матрасы, торгово-производственная компания?utm_medium=widget-source&utm_campaign=firmsonmap&utm_source=route">Найти проезд до Алматинские Ортопедические Матрасы, торгово-производственная компания</a></div>
              <script charset="utf-8" src="https://widgets.2gis.com/js/DGWidgetLoader.js"></script>
              <script charset="utf-8">
                  new DGWidgetLoader({
                      "width": 600,
                      "height": 400,
                      "borderColor": "#a3a3a3",
                      "pos": {
                          "lat": 43.24038837587517,
                          "lon": 76.90487623214723,
                          "zoom": 16
                      },
                      "opt": {
                          "city": "almaty"
                      },
                      "org": [{
                          "id": "70000001024028702"
                      }]
                  });
              </script><noscript style="color:#c00;font-size:16px;font-weight:bold;">Виджет карты использует JavaScript. Включите его в настройках вашего браузера.</noscript>
          </div>
      </div>
      • 0
      1067
        •  Команда Pandoge
      изменено 22 ноя в 01:23

      Sergey, попробуйте так.

      1. Строку

      <script charset="utf-8" src="https://widgets.2gis.com/js/DGWidgetLoader.js"></script>

      замените на:

      <div class="DGWidgetLoader__result"></div>

      2. Скрипт (строки 6-23, за исключением noscript) замените на:

      <script charset="utf-8">
      
      	setTimeout(function() {
      			  
      		!function(){function o(o){var t=document.getElementById(o);t&&(t.style.display="none")}function t(o){for(var t=document.querySelectorAll("."+o),i=0;i<t.length;i++)t[i].style.display="none"}function i(o,t){var i="https:"===window.location.protocol?"https:":"http:";return i+"//widgets.2gis.com/widget?type="+o+"&options="+encodeURIComponent(JSON.stringify(t))}function r(o){if(!o.src)return"";var t=o.borderColor?"1px solid "+o.borderColor:"none";return'<iframe frameborder="no" style="border: '+t+'; box-sizing: border-box;" width="'+o.width+'" height="'+o.height+'" src="'+o.src+'"></iframe>'}window.DG=window.DG||{},DG.Widget=DG.Widget||{},DG.Widget.Components=DG.Widget.Components||{},window.DGWidgetLoader=function(n){t("dg-widget-link"),o("firmsonmap_biglink"),o("firmsonmap_biglink_photo"),o("firmsonmap_biglink_route"),n=n||{},n.org=n.org||[],n.pos=n.pos||{},n.opt=n.opt||{};var e=n.width||900;e=e.toString(),"%"!=e.slice(-1)&&(e=parseInt(e,10),e=Math.min(1200,e),e=Math.max(500,e));var d=n.height||600;d=d.toString(),"%"!=d.slice(-1)&&(d=parseInt(d,10),d=Math.min(1e3,d),d=Math.max(400,d));for(var s=n.borderColor||"#a3a3a3",a="",g=0;g<n.org.length;g++)n.org[g].id&&(a+=n.org[g].id+",");a=a.slice(0,-1);var p={pos:n.pos,opt:n.opt,org:a};document.querySelector(".DGWidgetLoader__result").innerHTML = r({width:e,height:d,borderColor:s,src:i("firmsonmap",p)});},DG.Widget.Components.Loader=function(t){o("2gis_mini_biglink");var n,e,d=700,s=400,a=t.resize;a?(n=a.w?parseInt(a.w,10):d,e=a.h?parseInt(a.h,10):s):(n=d,e=s),document.querySelector(".DGWidgetLoader__result").innerHTML = r({width:n,height:e,src:i("mini",t)});}}();
      				  
      		new DGWidgetLoader({
      			"width": 600,
      			"height": 400,
      			"borderColor": "#a3a3a3",
      			"pos": {
      				"lat": 43.24038837587517,
      				"lon": 76.90487623214723,
      				"zoom": 16
      			},
      			"opt": {
      				"city": "almaty"
      			},
      			"org": [{
      				"id": "70000001024028702"
      			}]
      		});
      		
      	}, 2000);
      
      </script>
      • 0
      30
        •  Проверенный
      22 ноя в 10:46

      Sergey, заменил на ваш код

      но видимо что то не так

             <div class="container">
                  <div class="row justify-content-center">
                      <div class="col-lg-7">
                          <div class="contact-map">
                              <a class="dg-widget-link" href="http://2gis.kz/almaty/firm/70000001024028702/center/76.90487623214723,43.24038837587517/zoom/16?utm_medium=widget-source&utm_campaign=firmsonmap&utm_source=bigMap">Посмотреть на карте Алматы</a>
                              <div class="dg-widget-link"><a href="http://2gis.kz/almaty/firm/70000001024028702/photos/70000001024028702/center/76.90487623214723,43.24038837587517/zoom/17?utm_medium=widget-source&utm_campaign=firmsonmap&utm_source=photos">Фотографии компании</a></div>
                              <div class="dg-widget-link"><a href="http://2gis.kz/almaty/center/76.905122,43.239298/zoom/16/routeTab/rsType/bus/to/76.905122,43.239298╎Алматинские Ортопедические Матрасы, торгово-производственная компания?utm_medium=widget-source&utm_campaign=firmsonmap&utm_source=route">Найти проезд до Алматинские Ортопедические Матрасы, торгово-производственная компания</a></div>
      
      <script charset="utf-8">
      	
      	setTimeout(function() {
      
      		// Отложили скрипт на 2 секунды
      			
      		$.getScript("https://widgets.2gis.com/js/DGWidgetLoader.js", function() {
      
      			// Выполнили скрипт после загрузки DGWidgetLoader.js
      	
      			new DGWidgetLoader({
      				"width": 600,
      				"height": 400,
      				"borderColor": "#a3a3a3",
      				"pos": {
      					"lat": 43.24038837587517,
      					"lon": 76.90487623214723,
      					"zoom": 16
      				},
      				"opt": {
      					"city": "almaty"
      				},
      				"org": [{
      					"id": "70000001024028702"
      				}]
      			});
      			
      		});
      			
      	}, 2000);
      
      </script>
      • 0
      1067
        •  Команда Pandoge
      изменено 22 ноя в 13:31

      Sergey, сделали так, просто из-за особенностей файла DGWidgetLoader.js очищается содержимое страницы. Свой ответ выше поправил, проверьте ещё раз.

      Я не просто вынес скрипт, как вы это сделали в первом комментарии, а произвел ещё несколько замен.

      Первая:

      document.write(r({width:e,height:d,borderColor:s,src:i("firmsonmap",p)}))

      на

      document.querySelector(".DGWidgetLoader__result").innerHTML = r({width:e,height:d,borderColor:s,src:i("firmsonmap",p)});

      Вторая:

      document.write(r({width:n,height:e,src:i("mini",t)}))

      на

      document.querySelector(".DGWidgetLoader__result").innerHTML = r({width:n,height:e,src:i("mini",t)});

      Это позволило убрать очистку страницы, которая у вас возникла.

      В вашем последнем комментарии вы (видимо случайно) удалили несколько закрывающих тегов + тег noscript. Их нужно вернуть на место.

      • 1
      30
        •  Проверенный
      22 ноя в 13:55

      Артём Мáлков, Спасибо большое!

      Работает )

Подняться наверх
«Pandoge» - помощник вебмастера