jQuery selectイベントでクリックイベントをシミュレートする

Question

オプションの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> 

任意の助けをいただければ幸いです。

Answer 1

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

<select>の値を設定しても、その要素のクリックイベントは発生しません。直接呼び出さなければなりません。

Answer 2

これはWooCommerceコアの一部なので、私はそのすべてを投稿できません。私はそれは多くのことを教えてくれます場合はあまりわからないが、しかし、ここでは動作しませんオプションのクリックイベントをトリガ...

.on('change', '.variations select', function(event) { 

    $variation_form = $(this).closest('form.variations_form'); 
    $variation_form.find('input[name=variation_id]').val('').change(); 

    $variation_form 
     .trigger('woocommerce_variation_select_change') 
     .trigger('check_variations', [ '', false ]); 

    $(this).blur(); 

    if($().uniform && $.isFunction($.uniform.update)) { 
     $.uniform.update(); 
    } 

}) 

Answer 3

スニペットです。ここではありませんスニペットは次のとおりです。

$('#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を持っています。 これは動作するはずです。

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