Как предотвратить проверку данных браузера по умолчанию?

Question

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

My CodePen

Я пытался реализовать event.preventDefault(); однако это, кажется, не работает в моем случае.

$('#profile-info-form').unbind('submit').bind("submit", function(event) { 
    event.preventDefault(); 
    console.log('save button clicked'); 
}); 

Пример входных полей, которые я создаю на лету:

var myphone = "<li><label>Cell Phone:</label></li><li><input type='tel' pattern='[0-9]{10}' class='added_mobilephone' name='mobilephone' value='' autocomplete='off' maxlength='20' /></li>"; 

Как бы вы справиться с этой проблемой?

Answer 1

Удалить атрибут pattern? Просто используя tel-тип, вы все равно получите интерфейс клавиатуры на мобильном телефоне и без шаблона, который не должен запускаться на основе собственной проверки/форматирования.

Answer 2

Если вы хотите отключить проверку на стороне клиента для формы, добавьте атрибут novalidate в элемент формы. Fx:

<form method="post" action="" id="profile-info-form" novalidate> 

// Your script Here 

</form> 

См http://www.w3.org/TR/html5/forms.html#attr-fs-novalidate