jQuery pobiera wartość wejściową po naciśnięciu klawisza

Zdając sobie sprawę, że jest to dość stary post, i tak udzielę odpowiedzi, ponieważ zmagałem się z tym samym problemem.

Należy zamiast tego użyć zdarzenia "input" i zarejestrować się za pomocą metody .on. Jest to szybkie - bez opóźnienia keyup i rozwiązuje brakujący ostatni problem z naciśnięciem klawisza, który opisałeś.

$('#dSuggest').on("input", function() {
    var dInput = this.value;
    console.log(dInput);
    $(".dDimension:contains('" + dInput + "')").css("display","block");
});

Demo tutaj

Użyj .keyup zamiast klawiatury.

Użyj również $(this).val() lub po prostu this.value, aby uzyskać dostęp do bieżącej wartości wejściowej.

DEMO tutaj

Informacje o .keypress z jQuery docs,

Zdarzenie keypress jest wysyłane do elementu, gdy przeglądarka się zarejestruje wejście z klawiatury. Jest to podobne do zdarzenia keydown, z wyjątkiem przypadek powtórzeń klucza. Jeśli użytkownik naciśnie i przytrzyma klawisz, klawisz zdarzenie jest wyzwalane raz, ale są wyzwalane oddzielne zdarzenia naciśnięcia klawisza dla każdego wstawionego znaku. Ponadto klawisze modyfikujące (takie jak Shift) wyzwalają Zdarzenia typu keydown, ale nie Zdarzenia typu keypress.

Musisz przerwać wątek wykonawczy, aby umożliwić aktualizację danych wejściowych.

  $(document).ready(function(event) {
       $("#dSuggest").keypress(function() {
           //Interrupt the execution thread to allow input to update
               setTimeout(function() {
                   var dInput = $('input:text[name=dSuggest]').val();
                   console.log(dInput);
                   $(".dDimension:contains('" + dInput + "')").css("display","block");
               }, 0);
       });
  });

Dzieje się tak dlatego, że zdarzenie Keypress jest wywoływane przed dodaniem nowego znaku. Użyj zdarzenia 'keyup', które będzie działać idealnie w twojej sytuacji.

$(document).ready(function() {
    $("#dSuggest").keyup(function() {
        var dInput = $('input:text[name=dSuggest]').val();
        console.log(dInput);
        $(".dDimension:contains('" + dInput + "')").css("display","block");
    });
});

Chcę dodać do tego, jeśli masz wiele pól tekstowych i musisz zrobić to samo na ich zdarzeniu keyup, możesz po prostu dać im wspólną klasę css (np.

$(document).ready(function() {
    $(".commoncss").keyup(function() {
        //your code
    });
});

To znacznie zmniejszy Kod, ponieważ nie musisz stosować zdarzenia keyup według id dla każdego pola tekstowego.

Szukałem przykładu ES6 (żeby mógł przejść mój linter) Więc dla innych ludzi, którzy szukają tego samego:

$('#dSuggest').keyup((e) => {
    console.log(e.currentTarget.value);
});

Użyłbym również keyup, ponieważ otrzymujesz aktualną wartość, która jest wypełniona.

Myślę, że potrzebujesz poniższego prototypu

$(element).on('input',function(){code})