Блог

Главная - Вопросы по программированию - Выделение нескольких кнопок отправки при отправке 1 с помощью getElementById

Выделение нескольких кнопок отправки при отправке 1 с помощью getElementById

#javascript #jquery #html #getelementbyid

#javascript #jquery #HTML #getelementbyid

Вопрос:

Я довольно новичок в JavaScript. Моя цель — отключить все кнопки отправки на странице в течение 30 секунд после отправки одной. У меня есть несколько текстовых областей, отсюда и несколько кнопок отправки. Первый код работает нормально, но мне пришлось бы написать его 23 раза, чтобы получить желаемый результат. Является ли их способом написать код один раз, но включить все идентификаторы или любой другой код, чтобы получить тот же результат?

 // This works but I would have to write it 23 times, inserting the new id each rewrite
     <script type="text/javascript">
       setTimeout (function(){
       document.getElementById('news').disabled = null;
       },30000);
     </script>

//I have left out textarea for this example
<input id="news" type="submit" name="submit" value="Submit" disabled="disabled">

// This will not work, adding the extra id
     <script type="text/javascript">
       setTimeout (function(){
       document.getElementById('news', 'sports').disabled = null;
       },30000);
     </script>
//I have left out textarea for this example 
<input id="news" type="submit" name="submit" value="Submit" disabled="disabled">

//I have left out textarea for this example 
<input id="sports" type="submit" name="submit" value="Submit" disabled="disabled">

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

1. попробуйте, добавив класс к кнопкам..

2. Дайте им всем класс и getElementsByClassName . Затем выполните итерацию по коллекции.

Ответ №1:

Поскольку у вас есть jquery в качестве тега, вы могли бы сделать это:

   setTimeout (function(){
      $("input").each(function(){
           $(this).prop('disabled', true);
      })
   },30000);

Вы также можете добавить класс ко всем своим входным данным и использовать $(".class").each(function(){ вместо него

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

1. Я собираюсь реализовать это и вернуться

2. Мне жаль, ювиан, но я должен отдать должное там, где это необходимо. Ваш код выделил серым цветом все кнопки отправки, но не при отправке одной кнопки. Мэтт Берландс делает именно то, о чем я просил, он просто ставит на 3 секунды вместо 30. Большое вам спасибо за ввод!

3. @posh2.0 единственное отличие, которое я замечаю, — это 3 секунды вместо 30, и у меня было, хотя вы хотели сделать их серыми, если вы хотите включить их снова, как это делает Мэтт, вам нужно использовать $(this).prop('disabled', false);

4. Да, но в случае отправки пользователем, тогда есть 30-секундная задержка для всех кнопок отправки.

Ответ №2:

Добавьте классы к своим кнопкам:

 <input class="submit" id="news" type="submit" name="submit" value="Submit" disabled="disabled">
<input class="submit" id="sports" type="submit" name="submit" value="Submit" disabled="disabled">

и тогда вы можете сделать что-то вроде этого:

 setTimeout(function () {
    var btns = document.getElementsByClassName('submit');
    for (var i = 0; i < btns.length; i  ) {
        btns[i].disabled = null;
    }
}, 30000);

http://jsfiddle.net/5Jw5n/

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

1. Спасибо, что добавление класса к каждому из них на самом деле делает именно то, для чего я снимал. P.S. 30 секунд — это 30000 🙂

2. @posh2.0: Да, я знаю. Для моей скрипки я не собирался ждать 30 секунд. Не стесняйтесь добавлять все, что вам нужно.

Ответ №3:

Используя jquery, чтобы отключить кнопки, которые вы бы сделали

       $('#news').prop('disabled', 'disabled');
      setTimeout($("$('#news').prop('disabled', '');" 30000);
      $('#sports').prop('disabled', 'disabled');
      setTimeout($("$('#sports').prop('disabled', '');" 30000);

Это можно изменить, чтобы в общем случае отключить / включить все кнопки на странице с помощью

 $("button, input[type='button']").prop('disabled', 'disabled');
setTimeout(function(){$("button, input[type='button']").prop('disabled', '');}, 30000);
Метки: