Приложение jQuery не видит изменений? - PullRequest
0 голосов
/ 09 августа 2011

У меня есть несколько сценариев, которые изменяют мое веб-приложение.Что он делает в основном:

  1. Добавление динамических элементов в DOM
  2. Изменение размера некоторых элементов DOM в соответствии с высотой окна и других элементов ...

Итак, я делаю:

$(document).ready ->
  $('.interval-view').wrapInner   '<div class="column" />'
  $('.column').wrapInner          '<div class="inner-column" />'
  $('#contents, #footers').append '<div class="clearfix"></div>'

  $('.interval-view:even').css 'background-color', '#F9F9F9'
  $('.interval-view:odd').css  'background-color', '#DDD'

  resize = ->
    $('.column').height                         $(window).height() - $('#filter-list').outerHeight(true) - $('#footers').outerHeight(true)
    $('#timeline-panel').width                  $(window).width()
    $('#timeline-panel .scrollable-area').width "#{$('.interval-view').length * $('.interval-view').width()}px"

  window.onorientationchange = ->
    resize()

  $(window).resize ->
    resize()

  resize()

Но я не получаю правильное значение высоты на $('.column').height.Скрипт возвращает мне значение высоты, как будто я не добавил элемент clearfix.Как будто он не учитывает эту часть, когда вычисляет окончательную высоту.

Я даже пробовал с отложенным объектом, но безуспешно.Он по-прежнему принимает высоту без учета clearfix элемента.

Для людей, не являющихся CoffeeScript, здесь я вставляю сгенерированный Javascript:

  $(document).ready(function() {
    var resize;
    $('.interval-view').wrapInner('<div class="column" />');
    $('.column').wrapInner('<div class="inner-column" />');
    $('#contents, #footers').append('<div class="clearfix"></div>');
    $('.interval-view:even').css('background-color', '#F9F9F9');
    $('.interval-view:odd').css('background-color', '#DDD');
    resize = function() {
      $('.column').height($(window).height() - $('#filter-list').outerHeight(true) - $('#footers').outerHeight(true));
      $('#timeline-panel').width($(window).width());
      return $('#timeline-panel .scrollable-area').width("" + ($('.interval-view').length * $('.interval-view').width()) + "px");
    };
    window.onorientationchange = function() {
      return resize();
    };
    $(window).resize(function() {
      return resize();
    });
    return resize();
  });

Любой способ исправить это?

Ответы [ 3 ]

0 голосов
/ 09 августа 2011

.live () используется для привязки события к элементу, созданному динамически после загрузки страницы.Какой браузер вы используете?а какая версия jQuery?Потому что я помню, что была ошибка с .heigth () и определенным браузером.

0 голосов
/ 09 августа 2011

Обратите внимание, что вы можете передать более одного аргумента события в jQuery live следующим образом:

$(window).live('resize onorientationchange', function () {
    resize();
});
0 голосов
/ 09 августа 2011

это может быть решено с помощью jquery .live

Метод .live () может влиять на элементы, которые еще не были добавлено в DOM с помощью делегирования события: привязка обработчика элемент предка отвечает за события, которые инициируются на его потомки. Обработчик, переданный в .live (), никогда не привязывается к элемент; вместо этого .live () связывает специальный обработчик с корнем Дерево DOM.

...