js无法在bs3 ajax模式中工作

时间:2013-12-08 05:38:29

标签: javascript jquery ajax twitter-bootstrap

我在 bs3 模式中使用 js 时遇到了一些问题 - 它不起作用。我用ajax打开模态。

主页

<a href="/modals/comp_activate.php" data-target="#modal-ajax" data-toggle="modal"><i class="fa fa-plus-circle"></i> Activate this computer</a>';

<div class="modal fade" id="modal-ajax" tabindex="-1" role="basic" aria-hidden="true">
    <img src="/assets/img/ajax-modal-loading.gif" alt="" class="loading">
</div>

<script src="/assets/scripts/custom/custom.js" type="text/javascript"></script>
<script>
    jQuery(document).ready(function() {    
        Custom.init();
    });
</script>

custom.js

var Custom = function () {

// private functions & variables

// external window links
var externalWindows = function() {
    $("a[data-window='external']").on('click', function() {
        window.open($(this).attr('href')); 
        return false; 
    });
}

// public functions
return {

    //main function
    init: function () {
        //initialize something here
        externalWindows(); // external window links 
    }

};

}();

模态页面中的链接

<a class="btn btn-primary" href="http://www.somesite.com/" data-window="external" onClick="$('#modal-ajax').modal('hide');"><i class="fa fa-shopping-cart"></i> Purchase Now</a>

所有这一切都是在浏览器的新窗口中打开data-window="external"的任何链接。由于使用ajax打开模态页面,因此主页面中的js不会将其取出。负载。我也可以在我的模态页面上添加该功能,但这会导致主页面出现问题。

我可以在这做什么?

1 个答案:

答案 0 :(得分:1)

您可以使用event delegation,以便动态加载的链接触发您的处理程序:

var externalWindows = function () {
    function openWindow() {
        window.open($(this).attr('href')); 
        return false;
    }

    $("a[data-window='external").click(openWindow);
    $("#modal-ajax").on('click', "a[data-window='external']", openWindow);
};