Найти первый символ ввода в текстовом поле - PullRequest
Новая
       10

Найти первый символ ввода в текстовом поле

1 голос
/ 15 февраля 2010

Я застрял в реализации следующего:

  1. Пользователь начинает печатать в текстовом поле.
  2. JavaScript на странице фиксирует первый набранный символ, подтверждает, что это английский алфавит (a-z, A-Z) и преобразует его в нижний регистр (при необходимости).
  3. Создайте запрос XMLHttp на основе ввода (т. Е. Если первый входной символ - a, получите a.xml, если b - b.xml и т. Д.).

Я знаю, как выполнить последнюю часть (сделать запрос xmlhttp), но я застрял на том, как захватить первый символ и проверить его (таким образом, который работает во всех браузерах). Пожалуйста, руководство. Спасибо.

Уточнение : Это для создания Google Suggest, как выпадающего меню автозаполнения без необходимости в программах на стороне сервера.

Ответы [ 2 ]

2 голосов
/ 15 февраля 2010

Какую часть проблемы вы не знаете, как это сделать? Вот подход, которому вы можете следовать. Очень вероятно, что потребуется корректировка, но хорошая отправная точка

если идентификатор нашего текстового поля равен 'txt' 

document.getElementByID('txt').onkeypress = function(e) {
  var textInField = this.value;
  if (textInField.length == 1) {
    var firstChar = textInField.charAt(0);
    if (/[a-zA-Z]/.test(firstChar)) {
      sendXHR(textInField.value.toLowerCase())
    }
  } else {
    // What do you do if there is one or more chars???
  }
}

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

2 голосов
/ 15 февраля 2010

Примерно так должно работать:

HTML: 

<input type="text" id="myField" />

А в JS: 

window.onload = function() {
    document.getElementById('myField').onkeyup = function() {
        // Validate that the first letter is A-Za-z and capture it
        var letter = this.value.match(/^([A-Za-z])/);

        // If a letter was found
        if(letter !== null) {
            // Change it to lowercase and update the value
            letter = letter[0].toLowerCase();
            this.value = letter + this.value.substring(1);

            // Do the request
        }
    }
}

Мои навыки ванили-JS немного ржавые, но это должно сработать. Просто, черт возьми, вот то же самое, используя jQuery: 

$(function() {
    $('#myField').keyup(function() {
        var letter = $(this).val().match(/^([A-Za-z])/);

        // If a letter was found
        if(letter !== null) {
            // Change it to lowercase and update the value
            letter = letter[0].toLowerCase();
            $(this).val(letter + $(this).val().substring(1);

            // Do the request
        }
    });
});
...