Запуск Javascript внутри простого модального окна - PullRequest
Новая
       7

Запуск Javascript внутри простого модального окна

1 голос
/ 18 февраля 2011

Я пытаюсь добавить сценарии в модальный ( simplemodal ) плагин jquery, но они не запускаются, эта функция просто недоступна при работе в модальном режиме или я что-то упустил.

Вот как я звоню simplemodal: 

$('#modal').modal({
  onClose: function (dialog) {
    $App.setLocation('#/');
    $.modal.close();
  }
});

и вот html модала, который включает скрипт addthis (я вынул реальное имя пользователя для публикации здесь): 

<div class="article clearfix">
  <div class="article-post">
    <h2 class="title">{{header}}</h2>
    <p class="date">Posted in {{feed_source}}, {{date}}</p>
    <ul class="tags clearfix">
      <li><a href="#">tag 1</a></li>
      <li><a href="#">tag 2</a></li>
    </ul>
    <div class="body">
      {{{body}}}
    </div>
  </div>
  <div id="single-article-comments" class="article-comments">
    <h3 class="comments-header">Comments:</h3>
  </div>
</div>
<div class="sidebar clearfix">
  <div class="sidebar-inner">
    <p class="sidebar-logo">Logo Text</p>
    <ul class="sidebar-menu">
      <li><a href="#single-article-comments" class="sidebar-comment tooltip" title="Comment on this article">Comment</a></li>
      <li><a href="#/rate/{{id}}" title="Rate" class="sidebar-rate tooltip">Rate</a></li>
      <li><a href="#/slate/{{id}}" title="Slate" class="sidebar-slate tooltip">Slate</a></li>
      <li><a href="#/report/{{id}}" title="Report Abuse / Flag as Inappropriate" class="sidebar-report tooltip">Report</a></li>
      <li><a href="#" title="Email">Email</a></li>
      <li><a href="#" title="Tweet">Tweet</a></li>
      <li><a href="#" title="Facebook Like">Like</a></li>
    </ul>
    <ul class="sidebar-action-addthis addthis_toolbox addthis_default_style" addthis:url="http://www.allaboutmidleton.ie/#/article/{article_id}" addthis:title="Tweet by {user}" addthis:description="{tweet}">
      <li><a href="http://www.addthis.com/bookmark.php" class="tooltip addthis_button_email" title="Email to a Friend"><img src="/assets/img/ico-email.png" width="26" height="23" border="0" alt="Email" /></a></li>
      <li><a class="addthis_button_tweet"></a></li>
      <li><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a></li>
    </ul>
    <!-- AddThis Button BEGIN -->
    <script type="text/javascript">var addthis_config = {"data_track_clickback":true};</script>
    <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=username"></script>
    <!-- AddThis Button END -->
    <div class="sidebar-ads">
      <ul class="advertising-ad-list">
        <li><a href="" class="ad">Advertisement</a></li>
        <li><a href="" class="ad">Advertisement</a></li>
        <li><a href="" class="ad">Advertisement</a></li>
      </ul>
    </div>
  </div>
</div>

Весь этот код отлично работает за пределами модального режима.Кто-нибудь знает способ запуска скрипта внутри модального.

Спасибо

Ответы [ 2 ]

0 голосов
/ 22 февраля 2011

SimpleModal является более мощным, чем, я хотел бы верить, даже Эрик Мартин знает.

  1. Создайте свой скрытый модальный div в своем основном документе;
  2. Создайте WHATVER FULL HTML /Страница ASP / JAVASCRIPT, которую вы хотите обработать в этом модальном режиме;
  3. Загрузите скрытый div с помощью страницы HTML / ASP / JAVASCRIPT, используя jquery.load ();
  4. Отображение модального
0 голосов
/ 18 февраля 2011

Что делает $App.setLocation('#/');?

Я не вижу причин, почему это не сработает, но предполагал, что обратный вызов onClose будет использоваться в основном для закрытия анимаций.

Я бы предложил использовать обратный вызов onShow и привязать свою собственную функцию к событию "close".Например: 

$('#modal').modal({
  onShow: function (dialog) {
    $('.close', dialog.data[0]).click(function () {
      $App.setLocation('#/');
      $.modal.close();
      return false;
    });
  }
});
...