0

ユーザーが投票にオプションを追加および削除できるjQueryダイアログがあります（jQueryを使用してDOMを更新します）。オプションが追加されるたびに、入力とボタン (「削除」) が次の形式でダイアログに追加されます -

<div id="existing-options">
    <div class="dialog-option">
        <div class="dialog-right">
            <div class="remove_option button-secondary" id="remove_new_0">Delete</div>
        </div>
        <div class="dialog-left">
            <input type="text" value="1" class="option text ui-widget-content ui-corner-all" id="new_0" name="new_0">
        </div>
    </div>
</div>

clickユーザーが入力に集中しているときにEnterキーを押すと、対応する「削除」ボタンのイベントが発生するようにしようとしています。

私はいくつかの調査を行いましたが、.sibling()不適切なようです。.prev()私の最良の選択肢のように思えましたが、それは機能していません。誰かがこれを機能させるための最良の方法を教えてもらえますか?

$(document).ready(function(){

    dialog_options_container = $('#existing-options'); // The container which holds the option inputs/buttons

    /** Capture the 'enter' key when removing an option */
    dialog_options_container.bind('keyup', '.option', function(e){
        if(e.keyCode === 13){
        $(this).prev('.remove_option').click();
        return false; // Ignore the default event
        }
    });

});
4

2 に答える 2

1

具体的にボタンをターゲットにしてみることができidます（例の 0 が新しいセクションごとにインクリメントされると仮定します）：

t.dialog_options_container.bind('keyup', '.option', function(e){
    if(e.keyCode === 13){
        var button_id = $(this).attr('id');
        $('#remove_' + button_id).trigger('click');
        return false; // Ignore the default event
    }
});

--編集--これを試して正しい要素を取得してください...

$('.dialog-left input[type="text"]').bind('keyup', function(e){
    if(e.keyCode === 13){
        var button_id = $(this).attr('id');
        $('#remove_' + button_id).trigger('click');
        return false; // Ignore the default event
    }
});
于 2013-10-13T22:31:09.353 に答える