Как сделать текстовые входы всегда автозаполнением

Question

Кажется, что некоторые текстовые входы сразу дают мне своего рода «выпадающее меню» со значениями, которые я заполнил в прошлом. Другие времена нет. Есть ли способ, которым я могу "поощрять" это поведение в вводах? Почему это иногда случается, а иногда нет? Должен ли я предоставить повторному пользователю куки-файл или какое-то другое устройство, чтобы убедиться, что у них будет эта функция или есть какой-нибудь параметр jquery? (так как я уже использую это).

Answer 1

Это зависит от браузера. Браузеры предположительно просматривают идентификатор и/или имя поля ввода текста и сохраняют введенное значение.

Он может быть пятнистым из-за ID/имени полей ввода, используемых на веб-сайтах, которые вы посещаете.

Answer 2

В браузере вы заполняете заполненные значения на основе типа ввода и имени.

Итак, когда кто-то вводит форму в examplea.com с именем с именем «login», когда вы переходите на exampleb.com и имеете вход с именем «login», браузер обнаруживает это, и у вас уже есть некоторые информация заполнена для ввода с именем «login» раньше и покажет вам некоторые параметры.

Это поведение браузера.

Для опции JQuery, вы можете использовать автозаполнение JQuery UI по адресу http://jqueryui.com/autocomplete/

Answer 3

Вот идея. Если вы хотите иметь определенный список раскрывающихся значений для каждого поля ввода на странице. Затем с помощью небольшого javascript, компилятора закрытия googles и знания о создании избранного/закладки для вашего браузера вы можете добавить себе что-то подобное на любую веб-страницу.

Вот мой пример кода на jsfiddle

HTML

<input type="text" /> 
<input type="text" /> 
<input type="text" /> 
<input type="text" list="sitelist" /> 
<datalist id="sitelist"> 
    <option label="Lorem" value="Lorem"> 
    <option label="Ipsum" value="Ipsum"> 
    <option label="Dolor" value="Dolor"> 
</datalist> 

Javascript

(function() { 
    var d = "proin vestibulum ipsum vel tortor sollicitudin luctus".split(" "), 
     l = document.createElement("datalist"); 

    l.id = "myDynamicDatalist"; 
    d.forEach(function (w) { 
     var o = document.createElement("option"); 
     o.label = w; 
     o.value = w; 
     l.appendChild(o); 
    }); 

    document.body.appendChild(l); 

    Array.prototype.forEach.call(document.getElementsByTagName("input"), function (e) { 
     if (e.list === null || e.list === "") { 
      e.setAttribute("list", l.id); 
     } 
    }); 
}()); 

Теперь с помощью Google's closure compiler, вы можете избавиться от всех пробелов и сократить вещи в одну строку текста, просто установив опцию «simple», и вы закончите с этим.

(function(){var b=document.createElement("datalist");b.id="myDynamicDatalist";"proin vestibulum ipsum vel tortor sollicitudin luctus".split(" ").forEach(function(a){var c=document.createElement("option");c.label=a;c.value=a;b.appendChild(c)});document.body.appendChild(b);Array.prototype.forEach.call(document.getElementsByTagName("input"),function(a){(null===a.list||""===a.list)&&a.setAttribute("list",b.id)})})(); 

Теперь вставляться в этой линии с javascript: и сохранить его в качестве любимых/закладки, и вы создали себе javascript bookmarklet.

Отдайте это. нажмите на свою любимую/закладку здесь, а затем дважды щелкните окно поиска, вуаля !.

Вы даже можете создать букмарклет с jquery, а jqueryui означает, что вы можете использовать их автозаполнение.