возникли проблемы с проверкой HTML5 для IE, специфичных при использовании setCustomValidity () - PullRequest
Новая
       0

возникли проблемы с проверкой HTML5 для IE, специфичных при использовании setCustomValidity ()

0 голосов
/ 09 октября 2018

У меня есть форма входа с политикой конфиденциальности флажка (обязательно), и я хочу отображать пользовательское сообщение проверки html5, если оно не отмечено, и нажмите кнопку отправки формы.Я использовал встроенный JavaScript: 

<input name="privacypolicy" title="Please agree to our privacy policy" id="privacypolicy" required="" oninput="this.setCustomValidity('')" oninvalid="this.setCustomValidity('Please agree to our privacy policy')" type="checkbox" value="agree">

Это работает для Chrome и Firefox.Но не работает должным образом для IE (11 или край).Сценарий: 1. Если все правильно и подано, все работает.2. если это не проверено и затем отправлено, оно показывает всплывающее сообщение проверки.Но даже после проверки и отправки все равно отображается сообщение об ошибке, а формы не отправляются вообще.

Пожалуйста, помогите!

Ответы [ 2 ]

0 голосов
/ 10 октября 2018

Пожалуйста, обратитесь к следующему коду, он хорошо работает на моей стороне (используя IE11 и Chrome)

Javascript-скрипт: 

<script type="text/javascript">
    function page_load() {
        document.getElementById("privacypolicy").setCustomValidity("Please indicate that you accept the Terms and Conditions!");
    };
</script>

HTML-код: 

<body onload="page_load();">
    <form id="form1" runat="server">
        <div>
            <p>
                <input title="Please agree to our privacy policy" required="required"
                    onchange="this.setCustomValidity(validity.valueMissing ? 'Please indicate that you accept the Terms and Conditions!!!!' : '');"
                    id="privacypolicy" type="checkbox" name="privacypolicy" />
                I accept the <u>Terms and Conditions</u>
            </p>
            <p>
                <input type="submit" />
            </p>
        </div>
    </form>
</body>

Скриншот как показано ниже: enter image description here

0 голосов
/ 09 октября 2018

Вы пытались реализовать свой собственный слушатель событий? 

document.addEventListener("DOMContentLoaded", function(){
  var invalid = function(e) {   
    if(e.target.validity.valueMissing){
      e.target.setCustomValidity("Please agree to our privacy policy");
      return;
    }
  };

  var privacypolicy = document.getElementsByName("privacypolicy");
  privacypolicy[0].oninvalid = invalid;
  privacypolicy[0].oninput = function(e) {
    e.target.setCustomValidity("");
  };
});

и HTML 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Privacy Policy</title>
  </head>
  <body>
    <form action="">
      <label for="privacypolicy"> Privacy Policy </label>
      <input name="privacypolicy" id="privacypolicy" required="" type="checkbox" value="agree">
      <br/>
      <input type="submit"/>
    </form>
  </body>
</html>

К сожалению, я не могу протестировать этот код в IE11, потому что я использую Ubuntuно в хроме отлично работает!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...