Отключить кнопку в течение 30 секунд

Question

У меня есть кнопка (где я не могу изменить ни один из HMTL), который нажимает, чтобы сохранить ответ на вопрос.

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

Вот HTML код, который я не могу изменить каким-либо образом:

<input type="submit" class="btnLarge" value="Submit" name="submit"> 

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

Answer 1

Вы могли бы попробовать что-то вроде этого:

 
var element = document.getElementById('submitBtn'); 
element.disabled = true; 
setTimeout(function(){ 
    element.disabled = false; 
}, 30000); 

Answer 2

начинается с вашей кнопки отключены, добавлено уведомление отключил атрибут

HTML

<input type="submit" class="btnLarge" value="Submit" name="submit" disabled> 

JavaScript

Если вы не можете изменить HTML

document.getElementsByName("submit")[0].disabled = true; 

Чтобы включить через 30 секунд

Здесь используют setTimeout, чтобы включить его через 30 секунд. В анонимной функции setTimeout.

Для идентификации элемента вы можете использовать document.getElementsByName, он возвращает список элементов с заданным именем в (HTML) документе HTML. Таким образом, для доступа к первому элементу используется [0]

Изменение DOM property также называется отключенным и является логическим, которое принимает значение true или false.

setTimeout(function(){ 
    var element = document.getElementsByName("submit")[0] ; 
    element.disabled = false; 
}, 30000); 

Полный код

window.onload = function(){ 
    document.getElementsByName("submit")[0].disabled = true; 
    setTimeout(function(){ 
     var element = document.getElementsByName("submit")[0] ; 
     element.disabled = false; 
    }, 30000); 
} 

Answer 3

попробовать этот
в Javasript

var i=0; 
document.getElementsByName('submit')[0].setAttribute("disabled","disabled"); 
    window.onload = function() { 
     window.setTimeout(setdis, 30000); 
    } 
    function setdis() { 
     if(i==0) 
     { 
      document.getElementsByName('submit')[0].disabled = false; 
      i++; 
     } 
    } 

удачи

Answer 4

Попробуйте

<script type="text/javascript"> 
     setTimeout (function(){ 
     document.getElementById('submitButton').disabled = null; 
     },30000); 

     var countdownNum = 30; 
     incTimer(); 

     function incTimer(){ 
     setTimeout (function(){ 
      if(countdownNum != 0){ 
      countdownNum--; 
      document.getElementById('timeLeft').innerHTML = 'Time left: ' + countdownNum + ' seconds'; 
      incTimer(); 
      } else { 
      document.getElementById('timeLeft').innerHTML = 'Ready!'; 
      } 
     },1000); 
     } 
    </script> 

<form> 
     <input type="submit" disabled="disabled" id="submitButton" /> 
     <p id="timeLeft">Time Left: 30 seconds</p> 
    </form> 

Answer 5

Поскольку вы не можете изменить html, вы можете использовать функции javascript. Дайте идентификатор вашей кнопке. Отключите его при загрузке страницы.

<input type="submit" class="btnLarge" value="Submit" name="submit" disabled="disabled" id="saveAns"> 

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

<script type="text/javascript"> 
window.onload=function() { setTimeout(function() 
{ 
    document.getElementById('saveAns').disabled = false;},30000); 
} 

Answer 6

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

function disableElementForSpecifiedTime(className, disabledTime_milliseconds) 
{ 
    var element = document.getElementsByClassName(className)[0]; 
    element.disabled = true; 

    setTimeout(function(){ 
     element.disabled = false; 
    }, disabledTime_milliseconds); 
} 

Вызов его как этот

disableElementForSpecifiedTime("btnLarge", 3000) 

Во имя практичности я бы рекомендовал подсветка кнопки, когда она включена, возможно, сделав его больше на данный момент, с помощью JQuery анимации.