jQuery bootstrap3模态回调函数
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/19676392/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Call back function in modal of bootstrap3
提问by HTTP
Im a little bit confuse about firing a call back function in javascript modal of bootstrap3. In normal jquery.post
you can do it like,
我对在 bootstrap3 的 javascript 模式中触发回调函数有点困惑。在正常情况下,jquery.post
你可以这样做,
$.post('path', { something: something }, function(data) {
console.log(data);
});
But in bootstrap 3 modal I fires the modal through script and I do it like this base on how I understand the explanation in their website.
但是在引导程序 3 模态中,我通过脚本触发模态,我这样做是基于我如何理解他们网站上的解释。
$('selector').modal('show', function() {
//here comes the problem, I have a button in the modal in the html, my code
//if the button was clicked inside this modal is..
$('#myButton').on('click', function() {
console.log("this is a try");
});
});
But sad to say if I click the button, nothing is happening, nothing was logged in the console. How do I call a callback function in a modal of bootstrap 3?
但遗憾的是,如果我单击该按钮,则什么也没有发生,控制台中也没有任何记录。如何在 bootstrap 3 的模式中调用回调函数?
回答by Zim
For Bootstrap 3, the events are now namespaced, so the show
event for the modal would be show.bs.modal
...
对于 Bootstrap 3,事件现在是命名空间的,因此模式的show
事件将是show.bs.modal
...
$('#myModal').on('show.bs.modal', function (e) {
alert('modal show');
});
Demo: http://bootply.com/90952
回答by mpsq
@Skellyis right, you can use the show.bs.modal
event like this:
@Skelly是对的,您可以show.bs.modal
像这样使用事件:
$('#myModal').on('show.bs.modal', function (e) {
alert('modal show');
});
The official documentation says:
官方文档说:
This event fires immediately when the show instance method is called.
当调用 show 实例方法时立即触发此事件。
Please note that this event is fired "quite soon" and you may need to use shown.bs.modal
instead.
请注意,此事件“很快”被触发,您可能需要使用它shown.bs.modal
。
Documentation about this event:
关于本次活动的文档:
This event is fired when the modal has been made visible to the user (will wait for CSS transitions to complete).
当模式对用户可见时会触发此事件(将等待 CSS 转换完成)。
This impacts @Keith yeoh'sanswer and you should avoid timeoutswhen possible.
这会影响@Keith yeoh 的回答,您应该尽可能避免超时。
Source: Official Bootstrap documentation
来源: 官方 Bootstrap 文档
回答by Keith Yeoh
Just a little to add for the 1st answer, it is because when the callback is triggered the DOM inside the modal is not completely loaded yet, perhaps should do a little hack here to holdback the action after callback for a while. Hope it helps!
只是为第一个答案添加一点,这是因为当触发回调时,模态内的 DOM 还没有完全加载,也许应该在这里做一些小技巧来阻止回调后的动作一段时间。希望能帮助到你!
$('#myModal').on('show.bs.modal', function (e) {
setTimeout(function(){
// something here
}, 300);
});
回答by rborodinov
I think better will be, to use "shown.bs.modal" it is fiered when modal is allready loaded. Bootstrap modal events
我认为更好的是,使用“shown.bs.modal”当模态已经加载时它会被触发。Bootstrap 模态事件
$('#myModal').on('shown.bs.modal', function (e) {
alert('modal is allready shown');
});
回答by CENT1PEDE
Wrap it with
用它包起来
$(window).on('load', function() {
...modal callback here.
});