Получение гаджета Google Directions от вызова Ajax - PullRequest
Новая
       11

Получение гаджета Google Directions от вызова Ajax

0 голосов
/ 09 октября 2009

Я пытаюсь собрать сайт с использованием Ajax впервые, чтобы, наконец, узнать время и разобраться. Пока это только HTML-страницы и немного JS. Используя какой-то базовый сценарий AJAX, который я нашел в сети, у меня есть основной index.htm, в котором есть заголовок, навигация и содержимое. Ajax вызывает захват другого содержимого (которое по большей части представляет собой просто файлы с текстовым содержимым) для добавления в div содержимого. По большей части это работает, за исключением случаев, когда я пытаюсь добавить гаджет Google Directions. Когда я добавляю код скрипта, который он дает мне в файл, и вызываю этот файл, заметных выходных данных нет.

Любые предложения о том, что я делаю неправильно или чего мне не хватает?

Ответы [ 2 ]

2 голосов
/ 30 октября 2009

Если я правильно вас понимаю, это ненужное использование AJAX. Судя по всему, вы хотите загрузить JavaScript с помощью вызова JavaScript. Это может быть выполнено с использованием любого метода, описанного здесь . Пример: 

<script type="text/javascript">

function dhtmlLoadScript(url)
{
   var e = document.createElement("script");
   e.src = url;
   e.type="text/javascript";
   document.getElementsByTagName("head")[0].appendChild(e);
}

onload = function()
{
   dhtmlLoadScript("dhtml_way.js");
}

</script>

Если приведенная выше ссылка не помогает или я неправильно понимаю ваш вопрос, предоставьте дополнительные пояснения или пример кода.

В продолжение вашего комментария

Вот обходной путь для вашего гаджета, код ниже будет на вашей главной странице (той, которая изначально загружена). Вот моя тестовая HTML-страница: 

<html>
<head>
  <script type="text/javascript">
  var gadget;

  function getGadgetAndMove(node)
  {
    gadget = document.getElementsByTagName("table")[0];
    node.appendChild(gadget); 
    gadget.style.visibility = "visible";
    gadget.style.display = "inline-block";
  }
  </script>
  <style>
  .ig_reset, .ig_tbl_line { visibility:hidden;}
  </style>
</head>

<body>
  <div onclick="getGadgetAndMove(this);">Test</div>
</body>
  <script src="http://www.gmodules.com/ig/ifr?url=http://hosting.gmodules.com/ig/gadgets/file/114281111391296844949/driving-directions.xml&amp;up_fromLocation=&amp;up_myLocations=1600%20Amphitheatre%20Pkway%2C%20Mountain%20View%2C%20CA&amp;synd=open&amp;w=320&amp;h=55&amp;title=Directions+by+Google+Maps&amp;brand=light&amp;lang=en&amp;country=US&amp;border=%23ffffff%7C3px%2C1px+solid+%23999999&amp;output=js"></script>
</html>

Если вам нужны дальнейшие объяснения, пожалуйста, дайте мне знать.

0 голосов
/ 21 мая 2011

Мне кажется, я знаю, чего вы хотите достичь, потому что столкнулся с той же проблемой. И я нашел решение. Поэтому я бы сказал, что нет, это не неправильное использование ajax, потому что вы можете столкнуться с этим при некоторых обстоятельствах.

Поместите гаджет направлений не непосредственно в содержимое страницы, которое загружается через ajax, а в отдельный файл, такой как "directionsgadget.html" (вставьте в этот файл тег сценария для гаджета).

Затем используйте iframe с src = "/ path / to / directionsgadget.html" в содержимом, загруженном ajax.

Гаджет должен быть загружен таким образом.

Если вы хотите, чтобы гаджет центрировался внутри iframe, вы можете обернуть тег сценария в directionsgadget.html в div с установленной шириной и style = "margin: 0px auto". Это будет центр гаджета.

Вот пример:

Ваша главная страница - index.html и содержит div, который будет содержать загруженный ajax контент: 

<!DOCTYPE html>
<html>
<head>
  <script type="text/javascript">
    $(document).ready(function(){
      $.ajax({
        url: 'ajaxcontent.html',
        success: function(returndata){ $('#ajaxcontent').html(returndata); }
      });
    });
  </script>
</head>
<body>
  <div id="ajaxcontent"></div>
</body>
</html>

Затем у вас есть файл с контентом, который должен быть загружен через ajax, и среди прочего это гаджет Google. Мы не собирались помещать гаджет прямо здесь, но собирались поместить его в отдельный файл и указать на него с помощью iframe. Давайте назовем этот первый файл ajaxcontent.html, как указано в вызове ajax в разделе head первого файла: 

  <span>Here is some content that will be loaded onto the main page via ajax.</span><br />
  <span>Among other things, there is a google directions gadget that will be loaded.</span>
  <div id="getdirections" style="margin:0px auto;">
    <iframe style="width:365px;height:216px;" src="directions.html"></iframe>
  </div>

Теперь мы поместим скрипт для гаджета Google в отдельный файл тег script внутри div просто так: 

<div style="width:336px;height:116px;margin:0px auto;">
  <script type="text/javascript" src="http://www.gmodules.com/ig/ifr?url=http://hosting.gmodules.com/ig/gadgets/file/114281111391296844949/driving-directions.xml&amp;up_fromLocation=&amp;up_myLocations=_a_bunch_of_information_with_personal_list_of_locations_&amp;synd=open&amp;w=320&amp;h=55&amp;title=Street+directions+by+Google+Maps&amp;brand=light&amp;lang=it&amp;country=ALL&amp;border=http%3A%2F%2Fwww.gmodules.com%2Fig%2Fimages%2F&amp;output=js"></script>
</div>

Надеюсь, этот пример был достаточно понятен!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...