在bootstrap模式中使用ajax加载内容

我想让我的bootstrap模态使用ajax检索数据：

我的模态：

 
 
 × 
Birthdays and Anniversaries
 
 
 
 
 Close {#Close#} 
  

当我点击链接时，会显示模态但是正文是空的。 此外，我没有看到任何ajax请求。 我正在使用Bootstrap 2.1.1

我究竟做错了什么？

Answer 1

最高投票答案在Bootstrap 3.3中已弃用，将在v4中删除 。 试试这个：

JavaScript的：

 // Fill modal with content from link href $("#myModal").on("show.bs.modal", function(e) { var link = $(e.relatedTarget); $(this).find(".modal-body").load(link.attr("href")); }); 

Html（基于官方示例 。请注意，对于Bootstrap 3. *我们设置data-remote="false"来禁用不推荐使用的Bootstrap加载函数）：

   Launch Modal   
 
 
 
 × 
Modal title
 
 
 ... 
 
 Close Save changes 
 
 
  

亲自尝试： https ： //jsfiddle.net/ednon5d1/

Answer 2

在Bootstrap 3中轻松完成，如下所示：

 Click me 

Answer 3

以下是我解决问题的方法，可能对某些人有用：

使用boostrap 2.1.1似乎没有Ajax模式

所以我最终自己编写代码：

 $('[data-toggle="modal"]').click(function(e) { e.preventDefault(); var url = $(this).attr('href'); //var modal_id = $(this).attr('data-target'); $.get(url, function(data) { $(data).modal(); }); }); 

调用模态的链接示例：

我现在通过ajax发送整个模态标记。

积分给drewjoh