Galleriffic: загружается перед моим кодом Jquery, который ссылается на объекты внутри него - PullRequest
0 голосов
/ 08 февраля 2012

У меня проблема с 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
<!-- We only want the thunbnails to display when javascript is disabled -->
<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.

Ответы [ 2 ]

0 голосов
/ 16 августа 2013

Немного поздно, но все равно :). Для этого есть решение, и вы даже можете поместить свой код в

$(document).ready();

проблема, как вы сказали, в том, что, когда вы хотите связать событие клика, его не с чем связать. Так почему бы не связать это с чем-то другим? Есть возможность с

.on ()

начиная с 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 все еще удаляет и добавляет эти структуры.

0 голосов
/ 08 февраля 2012

Вы пробовали это:

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);
    });
  });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...