13

これまでのところ、この作業コードがあります:

フィドル: http://jsfiddle.net/r4emt/12/

JQuery UI オートコンプリートに入る前は、ボタンに「Hello」と表示されています。JQuery UI のオートコンプリートで「item」と入力すると、ボタンに「World」と表示されます。「ワールド」ボタンをクリックして、アイテムをリストに追加します。item を再度入力すると、1 つを選択して、既にリストにある項目の置換ボタンをクリックできます。ただし、これを行うと、ボタンにはまだ「世界」と表示されますが、入力フィールドには何もないため、「こんにちは」と表示されるはずです。入力フィールドをクリックしてから削除または戻る矢印を押すと、「こんにちは」に戻りますが、削除したり左に移動したりするものはありません。コードのこの部分に関係していると思います：

$('#inputWrapper').on('keyup', '#tags', function() {
    if($(this).val() == '') {
        $('button.addButton').text('Hello');
    } else {
        $('button.addButton').text('World');
    }
});

具体的には「キーアップ」部分です。私の質問は、入力ボックスが空のときは常にボタンが「こんにちは」と表示され、フィールドに入力があるとボタンが「世界」と表示されるようにするにはどうすればよいですか? ありがとう！

4

7 に答える 7

23

ここに作業フィドルがあります。行われた変更は次のとおりです。

$('#tags').keyup( function() {
    if($(this).val() == '') {
        $('button.addButton').text('Hello');
    } else {
        $('button.addButton').text('World');        
    }
});

ボタンの最後にクリックします：

$('#tags').val('');
$('#tags').keyup();
于 2013-04-22T19:49:14.193 に答える
9

これは長いデッド スレッドであることはわかっていますが、これを追加する必要がありました。なぜなら、メモリ リークを追跡するのに 2 日間を費やしたからです (このページのコードを使用したことが原因です)。

重要: ボタン要素で jQuerys text() を使用しないでください。

この関数は、empty() で削除できないものを DOM に作成します。その後、関数を長期間にわたって複数回呼び出すと、大量のごみが DOM に取り込まれ、物が壊れます。

jQuery API ドキュメントを参照してください。

（ドキュメントで言及されている場所を正確に見つけることはできませんが、どこかにあります。今すぐ電車に走らなければなりません）...

于 2014-02-14T14:56:59.823 に答える
1

jsFiddle の動作デモ 

    $('#inputWrapper').on('keyup', '#tags', function() {
        if($(this).val() == "") {
            $('button.addButton').html('Hello1');
        } else {
            $('button.addButton').html('World');
        }
    });
于 2013-04-22T19:28:01.487 に答える
0

この関数が実行された後、キーアップ後にイベントリスナーが常に評価され、入力ボックスが常に値を持つようになるため、この関数は初回のみ機能します。ボタンをクリックすると、何かを入力してバックスペースを押して消去すると、Hello に戻ります。

希望する結果を得るには、入力ボックスをクリアするためにボタンの [送信] をクリックすると、そこでテキストを変更することもできます。

参照: http://jsfiddle.net/r4emt/37/

私はちょうど追加しました：

//refreshes button name
$(this).text('Hello');

ボタンクリック機能の最後まで。

于 2013-04-22T20:09:06.947 に答える
0

「テキスト」機能を使用する

       $("#inputWrapper").click(function () {
        $(this).text(function(i, v){
           return v === 'Hello' ? 'World' : 'Hello'
        })
于 2013-11-10T08:44:42.050 に答える