Использование .delegate или .live с операторами if (если пусто do blah blah blah) для динамического содержимого

Question

2 раза.

Мне нужно скрыть элемент (A), если другой элемент (B) пуст, и показать A, если B содержит элементы внутри.

И мне нужно сделатьэто на элементах, загружаемых динамически.

Итак, я попытался:

$(document).ready(function() {
  if ($('#mapDirections').html().trim()) {
    $('#mapReset').hide();
  }
  else
  {
    $('#mapReset').show();
  }
});

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

Answer 1

Надеюсь, у вас есть контроль над JavaScript, который заполняет #mapDirections. Вы должны реализовать поведение обратного вызова сразу после поступления данных.

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

Например, предположим, что onNewMapDirections () вызывается в ответ на какое-то событие в DOM:

function onNewMapDirections(newData) {
  $('#mapDirections').html(newData);
  //Add callback here
}

Это можно легко сделать путем привязки и запуска пользовательских обработчиков событий в документе:

//Called when new directions are ready to add to DOM
function onNewMapDirections(newData) {
  $('#mapDirections').html(newData);
  $(document).trigger('checkMapDirections');
}

//Called in response to dispatched event
function onMapDirectionsUpdated(evt) {
  if ($('#mapDirections').html().trim()) $('#mapReset').hide();
  else  $('#mapReset').show();
}

//Binds event
$(document).ready(function() {
  $(document).bind('checkMapDirections', onMapDirectionsUpdated);
});

Если вы не можете встроить обратный вызов, как только новые данные карты вызывают, вы все равно можете использовать логику событий и реализовать таймер, который периодически вызывает

$(document).trigger('checkMapDirections');