web-dev-qa-db-ja.com

jQueryは選択オプションのクリックイベントをシミュレートします

オプションの1つがクリックされるとAJAX要求をトリガーする選択メニューがあります。リンクから関連するオプションでクリックイベントをトリガーする必要があります。そのため、以下では、選択の値を変更しますが、クリックはシミュレートしません。

$('#click').click(function(){
    var value = $(this).attr("rel");
    $('#select').val(value);
    return false;
});

<select id="select" name="select">
    <option>Select...</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
</select>

<a href="#" rel="1" id="click">Click for option 1</a>

どんな助けでも大歓迎です。

jqueryselectclickoption
11
Stuart Taylor-Jones

オプションでクリックイベントをトリガーしても機能しません。次のスニペットがあります。

    $('#click').on('click', function(){
        var value = $(this).attr('rel'); //get the value
        value++; //increment value for the nth-child selector to work

        $('#select')
          .find('option:nth-child(' + value + ')')
          .prop('selected',true)
          .trigger('change'); //trigger a change instead of click

        return false;
    });

私はフィドルを設定しました here 同じことを示しています。これは動作するはずです。

クリックを使用する代わりに、変更イベントをトリガーして同じ効果を得ることができます。

14
Larrydx
$('#click').click(function(){
    var value = $(this).attr("rel");
    $('#select')
        .val(value)
        .trigger('click');
    return false;
});

<select>の値を設定するだけでは、その要素のクリックイベントはトリガーされません。直接呼び出す必要があります。

4
Brad M