Как запретить замену заполнителя autocomplete = "off"? - PullRequest
0 голосов
/ 05 октября 2018

Добавление атрибута-заполнителя к элементу ввода текста, по-видимому, сводит на нет мой атрибут autocomplete = "off".

Т.е. он восстанавливает раздражающий бананово-желтый выпадающий список, в котором отображаются предыдущие записи.(И, что еще хуже, в раскрывающемся списке можно найти некоторые из предложенных им сведений, поступающих из окон, открытых в браузере, которые не связаны с моей страницей.)

Более конкретно:

Этот элементНЕТ раздражающего небольшого бананово-желтого раскрывающегося списка с предыдущими записями.

<input class="textbox" 
       type="text" 
       name="firstname" 
       value="" autocomplete="off">

Но если я добавлю атрибут заполнителя, бананово-желтый раскрывающийся список вернется.

<input class="textbox" 
       type="text" 
       name="firstname" 
       value="" autocomplete="off" 
       placeholder="Enter First Name">

Это так?Можно ли использовать заполнитель, не возвращая этот раздражающий выпадающий список?

Я уверен, что достаточно кода js с помощью onblur, onfocus и, возможно, onkeypress, может имитировать заполнитель без раздражающего раскрывающегося списка.Но я надеялся на более простой способ.

Есть предложения?

Добавлено 10/5/18 - re: вопрос ниже о браузерах.Сегодня стало еще хуже.

Браузер IE последовательно поддерживает autocomplete = "off" для всех текстовых полей.

Но Chrome стал непоследовательным, как указано в комментариях, добавленных ниже.Имя, фамилия и имя, а также текстовое поле электронной почты игнорируют autocomplete = "off".Но это чтит это для обоих отчеств.И я просто не вижу различий в том, как кодируются текстовые поля.

Вот полный код моей формы.[Я положил пары метка / вход в таблицу, чтобы выстроить в ряд.(кроме того, кажется, что они отключили их, потому что нажатие на ярлык не смещает фокус на его ввод. Но это на другой день)]

<form id="formNo1" onsubmit="sendMessage(); return false;">
  <table id="formNo1Table">
    <tr>
        **<!—This is a <select> element -->**
    </tr>
    <tr>         **<!-- Chrom autocompletes / IE doesn’t -->**
      <td>
        <label class="label" for="firstname">First Name:</label>
      </td>
      <td>
        <input class="textbox"  type="text" 
               name="firstname" value="" 
               autocomplete="off" >
      </td>
    </tr>
    <tr>         **<!-- Both OK.  No autocomplete-->**
      <td>
        <label class="label" for="middle1st">Middle Name - First:</label>
      </td>
      <td>
        <input class="textbox"  type="text" 
               name="middle1st" value="" 
               autocomplete="off">
       </td>
    </tr>
    <tr>
        **<!—This is a <select> element-->**
    </tr>
    <tr>
      <td>       **<!-- Both OK.  No autocomplete-->**
        <label class="label" for="middle2nd">Second Middle Name - Second</label>
      </td>
      <td>
        <input class="textbox"  type="text" 
               name="middle2nd" value="" 
               autocomplete="off">
      </td>
    </tr>
    <tr>
      <td>         **<!-- Chrome autocompletes / IE doesn’t -->**
        <label class="label" for="lastname">Last Name:</label>
      </td>
      <td>
        <input class="textbox" type="text" 
               name="lastname" value="" 
               autocomplete="off">
      </td>
    </tr>
    <tr>
        <!—This is a <select> element
    </tr>
    <tr>
      <td>            **<!-- Chrome autocompletes / IE doesn’t -->**
        <label class="label" for="lastname2">Second Last Name:</label>
      </td>
      <td>
        <input class="textbox"  type="text" 
               name="lastname2" value="" 
               autocomplete="off">
      </td>
    </tr>
    <tr>
      <!—This is a <select> element
    </tr>
    <tr>
      <td>
        &nbsp;
      </td>
    </tr>
    <tr>
        <!—This is a <select> element
    </tr>
    <tr>
      <td>
       &nbsp;
     </td>
    </tr>
    <tr>
      <td>          **<!-- Chrome autocompletes / IE doesn’t -->**
        <label class="label" for="email">Email:</label>
      </td>
      <td>        <!-- Chrom autocompletes / IE doesn’t -->
        <input id="emailId"  
               class="textboxdim"    type="text"
               name="email"          value=name@dom.ext
               autocomplete="off">
      </td>
    </tr>
    <tr>
      <td>
        &nbsp;
      </td>
    </tr>
    <tr>
        <!—This is a text area element
    </tr>
    <tr>
      <td>
        &nbsp;
      </td>
    </tr>
    <tr>
      <td colspan="2" style="text-align:center;">
        <input class="label" name="submit button" 
               type="submit" value="Submit">
      </td>
    </tr>
  </table>
</form>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...