Question

当我的网页上的几个模态之一显示如下时，我尝试完成一个函数调用：

$('.modal')
.on('shown.bs.modal',
function (e) {
    var id = $(this).attr('id');
});

但是从不调用该函数。

它的工作原理如下：

$(window)
.on('shown.bs.modal',
function (e) {
    var id = $(this).attr('id');
});

但是通过这种方式我无法获得元素的id。

我如何实现它，我定义了一个函数，当显示多个模态之一并且模态的右元素作为参数传递时调用，所以我可以确定模态元素的id？

更新：我想我找到了问题的原因。我尝试在angularjs控制器中运行这个jQuery代码。

UPDATE2：我试图在我的角度控制器中运行以下代码，但它永远不会被调用：

  $document.ready(function () {
            jQuery('.modal')
            .on('shown.bs.modal',
                function (e) {
                    var id = $(this).attr('id');
                    NgMap.getMap("map-" + id)
                        .then(function (map) {
                            google.maps.event.trigger(map, 'resize');
                        });
                });
        });

Answer 1

我认为你应该使用模态的Id而不是类

$('#modal-ID') .on('shown.bs.modal', function (e) { var id = $(this).attr('id'); });

Answer 2

解决方案是指定其他类别，然后在其上触发事件

像

<强> HTML

public class JoddHttpClientDemoApplication {
    public static void main(String[] args) throws Exception {
         SpringApplication.run(JoddHttpClientDemoApplication.class, args);
         HttpRequest request = HttpRequest.get("https://xxxxx.com?0.6891255003788694").
            header("Referer","https://xxxxx.com/x.jsp");
         HttpResponse response = request.send();
         System.out.println(response);
    }
}

<强> Jquery的

<button type="button" data-toggle="modal" data-target="#imageUpload2">Launch modal</button>
<button type="button" data-toggle="modal" data-target="#imageUpload1">Launch modal</button>
<div class="sample modal fade" id="imageUpload2" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            Upload form here
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>
<div class="sample modal fade" id="imageUpload1" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            Upload form here
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>

<强> Jsfiddle

jquery for bootstrap modal不工作

2 个答案: