Jquery .click и .mouseover не работает на дисплее css3: таблица, строка, ячейка работает на HTML-таблицы? - PullRequest
0 голосов
/ 27 марта 2011

У меня была таблица, которая была сгенерирована из стандартного html и использовала прослушиватель событий JQuery .mouseover, а также прослушиватель .click. Все работало нормально. С тех пор я перешел к сбору данных из API Facebook, а затем к созданию информации на странице с помощью divs и CSS. Разбивка кода выглядит следующим образом:

Это функции jQuery:

$(document).ready(function() { 

        $('.fbLikeImage').mouseover(function() {
              $likeID = this.id;

              document.getElementById('uiFBULikeName').innerHTML = this.alt; 
              document.getElementById('uiFBLikeImage').innerHTML = "<img width='70' height='70' class='fbUserImage' src="+ this.src +" >";

                });

        $('.fbLikeImage').click(function(){
            showDiv('uiCommentTextInputWrapper');
            showDiv('likeButtonWrapper');

            });


});

Тогда вот рендеринг HTML:

<div class="table">
    <div class="tableRow">
        <div class="tableCell"> 
          <img width="50" height="50" id="192563358702" class="fbLikeImage"               src="http://profile.ak.fbcdn.net/hprofile-ak-snc4/50352_192563358702_7313174_s.jpg" title="hi,     friend" alt="hi, friend">
        </div>
        <div class="tableCell"> 
           <img width="50" height="50" id="126279274071407" class="fbLikeImage" src="http://profile.ak.fbcdn.net/hprofile-ak-snc4/195799_126279274071407_7781147_s.jpg"  title="Momentographics | Photography &amp; Design" alt="Momentographics | Photography &amp; Design">
        </div>
     </div>
</div>

Есть намного больше строк, чем это, но это основная структура.

Вот код из моего CSS:

.table{
display:table;
}

.tableRow{
display:table-row;

}
.tableCell{
display:table-cell;
vertical-align:top;

}

Это работало нормально, прежде чем я преобразовал его в формат таблицы на основе CSS. Любые идеи были бы велики, я не смог решить эту.

Ответы [ 2 ]

0 голосов
/ 28 марта 2011

Я понял это. Таблица css DIV не была создана и готова до того, как функция doc.ready запустила слушателей. Я помещаю слушателей в другую функцию и вызываю их в конце функции, которая создает таблицу css. Таким образом, слушатели не запускаются, пока не сгенерирован другой код.

0 голосов
/ 27 марта 2011
    $(function () { 

        $('.fbLikeImage').mouseover(function() {
              var likeID = $(this).id;

              $('#uiFBULikeName').html($(this).alt); 
              $('#uiFBLikeImage').html("<img width='70' height='70' class='fbUserImage' src=' + $(this).src + ' >")

         });

        $('.fbLikeImage').click(function(){
            $('div uiCommentTextInputWrapper').show();
            $('div likeButtonWrapper').show();

            });
});
I would suggest something like this, but I'm not sure if the click function works like this.. else try by passing the class or ID with it.
...