Как отключить кнопку отправки с помощью cookie / сессий или localestorage

#javascript #php #html #forms

#javascript #php #HTML #формы

Вопрос:

Я знаю, что файлы cookie / хранилище могут быть удалены, но все же это может предотвратить множество спамеров-людей, которые не знают об этом.

Как мне отключить кнопку отправки формы на определенной странице только на 1 день?

Итак, код, который сохраняет «Отправленные» файлы cookie, когда пользователь отправляет форму, и если он перезагружает страницу или входит снова, браузер проверяет, «отправил» ли пользователь файлы cookie, если да { кнопка отключить} Другое { кнопка по умолчанию}

Примечание * на моем веб-сайте есть несколько страниц формы, поэтому я ищу метод, который работает для определенной страницы только при внедрении кода, как мне использовать этот код в этом

 <form action="userdata.php">
  <input type="text" id="question">
  
  <input type="submit" value="Submit">
</form> 
  

Это последнее, что мне нужно добавить на мой веб-сайт, если это будет сделано, я наконец смогу опубликовать свой веб-сайт, поэтому, пожалуйста, помогите мне в этом.

Ответ №1:

Попробуйте это:

 let button = document.getElementById('button');

button.addEventListener('click', () => {
    let date = new Date();
    button.disabled = true;
    localStorage.setItem('validation', JSON.stringify({date: date}));
}); 

checkStorage = () => {
    if(JSON.parse(localStorage.getItem('validation'))){
        let item = JSON.parse(localStorage.getItem('validation'));
        let storageDate = new Date(item.date)
        let actualDate = new Date();

        if(actualDate - storageDate > 8.64e 7){
            button.disabled = false;
        }
    }
}


window.load = checkStorage();  

 <button id="button">Submit</button>  

Ответ №2:

Есть три способа, которыми вы могли бы это сделать.

  1. Серверная часть, это самый надежный способ, если у ваших пользователей есть учетные записи. Это также будет сохраняться на разных устройствах.

Измените способ отображения формы, когда пользователь уже отправил, чтобы отобразить входные данные следующим образом:

 <input type="submit" value="Submit" disabled>
  

Как вы это сделаете, будет зависеть от того, какова ваша серверная среда.

  1. localStorage После отправки формы сохраняет значение в локальном хранилище пользователей, например:
 window.localStorage.setItem('hasSubmittedForm', new Date())
  

Когда страница загружена, проверьте это значение и отключите ввод, если оно присутствует

 const stored = window.localStorage.getItem('hasSubmittedForm')
const storedAt = new Date(stored)
const now = new Date()
if (storedAt amp;amp; ((now - storedAt)/86400) > 1) {
    // disabled
}
  
  1. Файлы cookie
    Вероятно, вам следует использовать библиотеку, подобную cookies js, а не редактировать cookies вручную. Принцип тот же, что и # 2.
 Cookies.set('hasSubmittedForm', 'true')
Cookies.get('hasSubmittedForm')
  

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

1. Спасибо за помощь, у меня вопрос, могу ли я указать конкретную страницу локального хранилища?

2. @Sportsmanship вы не можете localstorage является общим для всех страниц. Вы могли бы изменить ключ, используемый localStorage, на URL страницы, чтобы у каждой страницы был свой собственный ключ (местоположение. путь) и не мешать друг другу.

3. Это из-за того, что я пишу свой page1.html в качестве ключа и так далее для определенных страниц