Блог

Главная - Вопросы по программированию - Целевая динамически добавляемая кнопка с помощью jquery (без события)

Целевая динамически добавляемая кнопка с помощью jquery (без события)

#javascript #jquery

#javascript #jquery ( jquery )

Вопрос:

Я хотел бы знать способ отключить и отключить, используя Jquery, динамически добавляемую HTML-кнопку.

Я знаю о функции .on(), но для того, чтобы работать, этой функции нужно и событие для прослушивания (например, щелчок или что-то в этом роде), и у меня нет никакого события для привязки, потому что я вызываю его из функции.

Это фактический код, который не работает, потому что кнопка с «#myID» является частичной, которая была введена динамически после готовности документа ():

  var validateForm = function(){
    if(exp_valid amp;amp; cc_valid amp;amp; ch_valid amp;amp; cvn_valid){
        $('#myID').prop('disabled', false);
    }
 }

Я хотел бы иметь правильный способ выбора, без события, моей динамически добавляемой кнопки.

Спасибо вам за чтение.

Комментарии:

1. Это просто, вам просто нужно дождаться появления кнопки, вы не можете изменить то, чего не существует.

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

3. Я могу настроить таргетинг на свою кнопку, и это работает $(‘#myID’).show(); Но я не могу ни включить, ни отключить мою кнопку, реквизит (‘disabled’, true) должен работать…

Ответ №1:

Вы можете сначала проверить, существует ли кнопка

 if ($(#myID).length) {
  $('#myID').prop('disabled', false);
}

Комментарии:

1. $(‘#myID).length возвращает 1, но я все еще не могу отключить или включить свою кнопку.

Ответ №2:

Что вы можете сделать, так это настроить a MutationObserver для отслеживания изменений в ваших элементах DOM, чтобы таким образом вы могли инициировать новую проверку, если что-то было добавлено в ваше дерево узлов.

Упрощенный JS:

 var observer = new MutationObserver(function() {
  // This is where you run your function
  $('#myID').attr("disabled", true);
  console.log($('#myID'));
});

observer.observe(document.documentElement, {
    childList: true,
    subtree: true            
});

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

Полная реализация действительно хорошо описана в этой статье: http://ryanmorr.com/using-mutation-observers-to-watch-for-element-availability /

Комментарии:

1. Спасибо, что поделились этим подходом и ресурсами. Это замечательно!

Ответ №3:

Мне удалось сделать это с помощью :

   $('#myID').attr("disabled", true);

Спасибо всем за ваше время.

Метки: