Question

这是我的代码，＆＃39; slide＆＃39; AJAX成功通话中的事件。

success: function(data) {
    $('#my_container').html(data);
    // I am getting' #mycarousel' successfully in to #my_container
    $('#mycarousel').bind('slid', function(e) {
        console.log('hi');
    }
    // tried 'slid.bs.carousel' too, no change.
    // btw, I can see my 'slid' function under event listeners for that element.
    // when I paste the above binding code in console again it shows the element too.
});

我想打印＆＃39; hi＆＃39;在滑动事件上进行控制，现在不能正常工作。

由于

Answer 1

动态加载轮播后，您必须对其进行初始化（建议androbin）：

  $('#my_container').html(data);

  $("#mycarousel").carousel();

  $('#mycarousel').bind('slide.bs.carousel', function (e) {
      console.log('slide event!');
  });

  $('#mycarousel').bind('slid', function (e) {
      console.log("slid event!");
  });

在这里你可以看到它有效：http://jsfiddle.net/faw242a8/1/

确保您通过ajax提取的html包含有效的轮播。

参考：Carousel - Bootstrap

Answer 2

检查页面中是否加载了多个版本的jquery库。

使用$.fn.jquery查找加载的版本，并使用您包含的jquery版本进行交叉检查，看两者是相同的。

Bootstrap幻灯片事件在AJAX成功中无效

2 个答案: