Ответы пользователя по тегу HTML
  • Как отключить автозаполнение форм с помощью html 5?

    @74webmaster
    Можно отключить автозаполнение, если в момент фокусировки в поле поменять у поля значение name на произвольное. А когда пользователь выходит из input, то поменять значение name обратно. В этом случае браузер Хром не выводит подсказок, т.к. каждый раз значение name новое.
    Необходимо подключать jquery, а ниже подключить сам скрипт.

    Исходник (взял отсюда только код, который генерит значение name) https://github.com/terrylinooo/jquery.disableAutoFill

    Что получилось в итоге:

    Это сама форма, показываю кусок формы, с полями ввода, для которых отключаю подсказки хрома. Оба инпута имеют класс "only-ru":

    <form ..>
    <input class="form-control city1 only-ru" type="text" name="city1" id="city1" placeholder="откуда" value="" autocomplete="off" >
    <input class="form-control city2 only-ru" type="text" name="city2" id="city2" placeholder="куда" value="" autocomplete="off" >
    ...
    </form>


    Сам скрипт, который при фокусе генерит произвольное значение для name, а при выходе из фокуса - возвращает значение name обратно, как мне нужно. Можете его улучить, сделать более универсальным:
    //поменять name при фокусе
    $('.only-ru').on("focus", function(){
    	var realFields = [];
        var realFieldsMapper = {};
    	$(this).each(function(i) {
    		realFields[i] = $(this).attr('name');
    		if(realFieldsMapper[realFields[i]]) {
    			$(this).attr('name', realFieldsMapper[realFields[i]]);
    		} else {
    			var randomName = Math.random().toString(36).replace(/[^a-z]+/g, '');
    			$(this).attr('name', randomName);
    			realFieldsMapper[realFields[i]] = randomName;
    		}
    	});
    });
    //поменять name обратно
    $(document).mouseup(function (e){ 
    	var div1 = $("#city1"), div2 = $("#city2");	
    	if (!div1.is(e.target)) $("input#city1").attr('name', 'city1');
    	if (!div2.is(e.target)) $("input#city2").attr('name', 'city2');
    });
    Ответ написан
    1 комментарий