Question

我正在尝试将脚本添加到模态（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>

所有这些代码在模态之外工作正常。有没有人知道在模态中运行脚本的方法。

由于

Answer 1

$App.setLocation('#/');在做什么？

我认为没有任何理由不起作用，但是onClose回调主要用于关闭动画。

我的建议是使用onShow回调并将您自己的函数绑定到“close”事件。例如：

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

Answer 2

SimpleModal比我想要的更强大，甚至Eric Martin也知道。

在主文档中创建模态隐藏div;
创建您想要在该模式中处理的完整HTML / ASP / JAVASCRIPT页面;
使用jquery.load（）;
显示模态

在simplemodal窗口中运行Javascript

2 个答案: