小编dgr*_*oss的帖子

如何使用Javascript正确创建警报框?

我正在尝试使用jQuery动态打开基金会警报框.当我尝试这样做时,关闭链接的行为有些不一致.如果页面上已有警报框,则关闭链接有效.但是,如果我通过JS创建的框是页面上的第一个框,则关闭链接不起作用.我正在使用Foundation 5.4.5.

我正在尝试做的简单演示:

HTML:

<a id="add">Add message</a>
Run Code Online (Sandbox Code Playgroud)

JS:

$("#add").click(function(event) {
   $("body").append("<div class=\"alert-box\" data-alert>Dynamic alert<a class=\"close\">&times;</a></div>");
});
Run Code Online (Sandbox Code Playgroud)

Codepen:http://codepen.io/dgross/pen/myyerB

但是,修改HTML以包含单独的警报会使它们都起作用:

<a id="add">Add message</a>
<div class="alert-box" data-alert>
...etc
Run Code Online (Sandbox Code Playgroud)

Codepen:http://codepen.io/dgross/pen/qEEOqN

有没有官方的做法让我失踪?我也试过触发'open.fndtn.alert-box'事件,似乎什么也没做.

jquery zurb-foundation zurb-foundation-5

4
推荐指数
1
解决办法
588
查看次数