0

グリッド SIZE / COLOUR に多数の INPUT フィールドを含むフォームがあります。価格を動的に計算するため、入力フィールドに数値が入力されるたびにフォームを送信する必要があります。

現時点ではこれが機能します：

$('.myval').bind('keyup', function() { 
    if($(this).val().length >= 2) {
        $('#cart').submit(); 
    }
});

しかし、ご覧のとおり、フォームを起動する前に 2 文字が必要です。

1、2、または 3 文字で発砲できるようにする必要があります (数量 4 、数量 56、数量 657 など)。したがって、別のキーが押されたかどうかを「確認」するために数ミリ秒間「待機」し、3 番目のキーが押されたかどうかを確認するためにもう一度待機する必要があると思います。

誰でもこれを手伝ってもらえますか？

4

5 に答える 5

2

サンプルデモ

私はこれがあなたが必要とするものだと思います

待ち時間を増減できます

var t;
$('.myval').keyup(function () {
    clearTimeout(t);
    if ($(this).val().length < 2) {
        t = setTimeout(function () {
            $('#cart').submit();
        }, 1000);
    } else {
        $('#cart').submit();
    }

});

これが役に立てば幸いです、ありがとう

于 2013-10-31T18:55:05.307 に答える
1

条件を「$(this).val().length < 3」に変更する必要があると思います

  $('.myval').bind('keyup', function() { 
    if($(this).val().length < 3) {
        $('#cart').submit(); 
      }
  });
于 2013-10-31T17:46:10.717 に答える
1

jquery.typing-0.2.0.min.jsこのタイプの機能が必要です。ここからダウンロードしてください：

http://lab.narf.pl/jquery-typing/

楽しみ！！！:)

于 2013-10-31T17:45:09.737 に答える
1

まず、jQuery の省略形を使用してkeyupイベントをバインドできます。

$('.myval').keyup(function () {

});

この回答delay()にある関数を使用できます。

var delay = (function(){
    var timer = 0;
    return function(callback, ms){
        clearTimeout (timer);
        timer = setTimeout(callback, ms);
    };
})();

以上をまとめると、keyupイベントとdelay()メソッドを使用して目的の結果を得ることができます。

$('.myval').keyup(function () {
    delay(function () {
        if($(this).val().length >= 2) {
            $('#cart').submit(); 
        }
    });  
})

免責事項：私はこれをテストしていません。微調整が必​​要な場合があります。電池は含まれていません。

于 2013-10-31T17:43:45.440 に答える
0

これにより、バックスペース キーを使用してタイプされた入力を削除することもできますが、1 つの入力をキャンセルして別の入力を使用する場合には適していません (より多くのロジックが必要になります)。Firefox 25.0 / Linux でテスト済み:

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
    <script type="text/javascript">
        var lenTemp1 = 0;
        var delay_ms = 1000;

        function testSubmit(inputElemId) {
            var actualLen = $("#" + inputElemId).val().length;
            if (actualLen && (actualLen == lenTemp1))
                $('#cart').submit();
            else {
                lenTemp1 = actualLen;
                window.setTimeout("testSubmit('" + inputElemId + "')", delay_ms);
            }
        }

        function initialKeyup() {
            lenTemp1 = $(this).val().length;
            $('.myval1').unbind('keyup', initialKeyup);
            window.setTimeout("testSubmit('myval1')", delay_ms);
        }

        $(document).ready(function() {
            $('.myval1').bind('keyup', initialKeyup);
        });
    </script>
</head>
<body>
    <form id="cart" method="GET" action="#" onsubmit="alert('debug info: submitted')">
        <input id="myval1" class="myval1" type="text" />
    </form>
</body>
</html>
于 2013-10-31T18:41:42.457 に答える