单击链接时 - 模态窗口无法打开

时间:2014-05-12 15:03:30

标签: php jquery twitter-bootstrap-3 modal-window

我在php中有一个项目。 我想显示一个模态窗口(在Bootstrap 3.1.1中完成),所以发送电子邮件到这个链接:

$mylink = "<a href = 'http://localhost/index.php?id =". $str. "'data-target =' # myModal 'class ='btn btn-primary 'data-toggle ='modal'>My trial version</a>";
                        $mail -> MsgHTML($mylink), dirname(__FILE__));                  
                        $mail -> AddAddress($email, 'Client');
                        $mail -> Send();

$str - a special id - business requirement.

模态窗口(Bootrstrap):

<div class="modal fade" id="myModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
                <h4 class="modal-title">Title</h4>
            </div>

            <div class="modal-body">
                <h3>Overflowing text to show scroll behavior</h3>

                <p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.<br />

                Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.<br />

                Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.<br />

                Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.<br />

                Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.<br />

                Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.<br />

                Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.<br />

                Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.<br />

                Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
            </div>

            <div class="modal-footer">
                <a href="#" id="clk" class="btn" data-dismiss="modal">Cancel</a>
                <a href="#" class="btn btn-primary">OK</a>
            </div>
        </div>
    </div>
</div>

阅读完电子邮件后 - 不要打开我的模态窗口。 我是否发送了不良属性的链接?

2 个答案:

答案 0 :(得分:1)

如果你想打开一个模态窗口并调用一个url,你需要用javascript一次做一件事。

$("#linkId").on("click",function(e) {
    e.preventDefault(); // to prevent the default link action

    $('#myModal').modal('show', 'test'); //open modal

    var url = $(this).attr('href');

    $.ajax({
      url: url,
    }).done(function(data) {
      console.log(data);
    });
    return false;
});

这是一个演示: http://jsfiddle.net/SL4Tg/2/

答案 1 :(得分:0)

在链接中添加ID或唯一类:

$mylink = "<a href = 'http://localhost/index.php?id =". $str. "'data-target =' # myModal 'class ='btn btn-primary 'data-toggle ='modal' id="linkId">My trial version</a>";

然后在你的点击处理程序

$("#linkId").on("click",function(e) {
     e.preventDefault(); // to prevent the default link action
     $('#myModal').modal('show');
});
相关问题