Question

我遇到了Galleriffic的问题，这是一个流行的jQuery插件，用于显示附近有HTML的图片。

在这个HTML中，我有一个图像，用作按钮：<img class="my_button" src="img/button.gif" />

在<head>和</head>标记之间，我有这个jQuery代码：

<script type="text/javascript">
$(document).ready(function () {
  $(".my_button").click(function(){
    $.get("page.php",function(data)
    {
      $('#mydiv').html(data);
    });
  });
});
</script>

问题是jQuery代码在 Galleriffic之前加载，因此加载$(".my_button").click(){}事件时没有按钮。

有没有办法强制Galleriffic在jquery代码之前加载？

以下是一些尽可能更清晰的代码：

<script type="text/javascript"> $(document).ready(function () { $(".my_button").click(function(){ $.get("pagea.php",function(data) { $('#mydiv').html(data); }); }); }); </script> ///some html <script type="text/javascript" src="Galleria Borse/js/jquery.history.js"></script> // Galleriffic libraries calls  <script type="text/javascript"> document.write('<style>.noscript { display: none; }</style>'); </script> <div class="navigation-container"> <div id="thumbs" class="navigation"> <a class="pageLink prev" style="visibility: hidden;" href="#" title="Previous Page"></a> <ul class="thumbs noscript"> //and other galleriffic containers and divs <img class="my_button" src="img/button.gif" /> //this is the button <script type="text/javascript"> jQuery(document).ready(function($) { //some Galleriffic code (Jquery code) }

我试图将代码$(".my_button").click(function(){});放在任何地方：在正文内部，页面底部甚至是Galleriffic库中。

Answer 1

你试过这个：

jQuery(document).ready(function($) { 
  //some Galleriffic code (Jquery code) 
  // Initialize Minimal Galleriffic Gallery
  $('#thumbs').galleriffic({
    imageContainerSel:      '#slideshow',
    controlsContainerSel:   '#controls'
  });
  $(".my_button").click(function(){
    $.get("pagea.php",function(data){
      $('#mydiv').html(data);
    });
  });
});

Answer 2

有点晚了，但无论如何:)。有一个解决方案，你甚至可以将代码放入

$(document).ready();

问题是，如你所说，当你想绑定click事件时，没有什么可以绑定它。所以，为什么不将它绑定到不同的东西。

有一个可能性

。对（）

自jQuery 1.7（左右）。在这个版本中.on还获得了.bind，.delegate和.live的功能。我们对.delegate的风格感兴趣：）。

所以而不是

$(".my_button").click(function(){})

使用

$('#foo').on('click','.my_button', function(){})

它的作用是，你将.on event绑定到#foo，它可以是任何东西，从一开始就在页面上（比如$(document)）。并且说“当你看到点击.my_button时会触发点击事件。这意味着，当.my_button最终到达时，它会起作用:)。

顺便说一句，这是用Galleriffic“harcore”定制解决另一个问题的方法:)。这是将动作附加到主幻灯片图像（或其包装器）的唯一方法，因为galleriffic仍在移除并附加这些结构。

Galleriffic：它在我引用其中的对象的Jquery代码之前加载

2 个答案: