-1

我正在尝试创建一个 reval Modal Foundation 6 和 Ajac，但不起作用。我按照官方指南

页面html 

<!DOCTYPE html><html lang="it">
<head>
 <title>Avvisi</title>
 <link href="http://ci.dev/assets/css/foundation.min.css" rel="stylesheet" type="text/css" />
<script src="http://ci.dev/assets/js/vendor/jquery.min.js" type="text/javascript">
</script><script src="http://ci.dev/assets/js/foundation.min.js" type="text/javascript"></script><script src="http://ci.dev/assets/js/foundation.reveal.js" type="text/javascript"></script><link href="http://ci.dev/assets/css/reveal.css" rel="stylesheet" type="text/css" /><link href="http://ci.dev/assets/css/motion-ui.css" rel="stylesheet" type="text/css" /><script src="http://ci.dev/assets/js/vendor/what-input.min.js" type="text/javascript"></script><script src="http://ci.dev/assets/js/vendor/motion-ui.js" type="text/javascript"></script></head>
<body>
<h2>Title</h2><p>Message</p>
<span><a href='http://ci.dev/AR-PIB/warn/edit_v/160/284'>Edit</a></span><span id='160|284'><a class='big-link' href='#' data-reveal-id='myModal' data-animation='fade'>Delete</a></span></div><hr/>
<script type="text/javascript">jQuery(document).ready(function() {
 jQuery('.big-link').click(function(){
 var dati = jQuery(this).parent().attr('id');
 var $modal = $('#modal');
 alert($modal)
 $.ajax({'http://ci.dev/AR-PIB/Warn/delete'})
 .done(function(resp){
 alert(resp);
 jQuery('body').append(resp);	
 $modal.html(resp.html).foundation('open');
 conaole.log(resp);
  });
 });
});
</script>
<script src="http://ci.dev/assets/js/app.js" type="text/javascript"></script></body></html>

4

3 回答 3

1

我不确定为什么它不能完全正常工作，因为我无法运行您的代码（链接http://ci.dev/...似乎是您机器的本地链接），但它可能是以下之一：

  • 你有一个关闭div但没有打开
  • 您在初始化 Foundation 之前尝试使用 Foundation JS（$modal.html(resp.html).foundation('open');等）（如果在 app.js 中，根据您的评论，这是在 Reveal 代码之后）
  • Foundation.min.js（除非您生成了精简版）包括动画 UI 和显示，因此您无需添加每个 JS 文件
  • 你错过了一个;之后alert($modal)
  • 我认为你的意思是console.log(resp);而不是conaole.log(resp);
  • 您引用了元素$('#modal')，但页面上没有带有 id 的元素modal（您的链接也有data-reveal-id='myModal'）
于 2016-06-18T20:20:40.480 回答
0

我找到了一个适用于 Zurb Foundation 6.3.2 的解决方案，如https://foundation.zurb.com/sites/docs/javascript.html#programmatic-use中所述

在 ajax 完成功能中：

var $modalContent = new Foundation.Reveal($('#modalContent'));
$modalContent.open();
于 2017-11-01T18:19:09.983 回答
0

根据基金会文件：

http://foundation.zurb.com/sites/docs/javascript.html#adding-content-to-plugins

只需添加一个Foundation.reInit('abide');，它应该立即工作！

于 2016-07-29T12:20:18.113 回答