シミュレートは、私が<code>select</code>要素にシミュレート<code>click</code>ためにこのコードを使用jQueryの

Question

でselect要素をクリックしてください：

$(function(){ 
    $("#click").click(function(){ 
     $("#ts").click(); 
     //$("#ts").trigger("click"); 
    }); 
}); 

とHTMLコードは次のとおりです。

<select id="ts"> 
    <option value="1">1</option> 
    <option value="2">Lorem ipsum dolor s.</option> 
    <option value="3">3</option> 
</select> 

<input type="button" id="click" value="Click"/> 

私はclickとtriggerをテストしますが、両方に動作しません。

ありがとうございました。

Answer 1

これは、あなたが私が思う買ってあげるほど近い：

$(function(){ 
    $("#click").on('click', function(){ 
     var s = $("#ts").attr('size')==1?5:1 
     $("#ts").attr('size', s); 
    }); 
    $("#ts option").on({ 
     click: function() { 
      $("#ts").attr('size', 1); 
     }, 
     mouseenter: function() { 
      $(this).css({background: '#498BFC', color: '#fff'}); 
     }, 
     mouseleave: function() { 
      $(this).css({background: '#fff', color: '#000'}); 
     } 
    }); 
}); 

FIDDLE

Answer 2

これは、私はあなたが得ることができると思う最高のクロスブラウザの方法です。 Safari、Firefox、Chrome、IEでテスト済み。 Chromeの場合、オスカー・ジャラの答えが行く方法です。 （更新：2016年10月13日）

$(function() { 
    $("#click").on('click', function() { 
     var $target = $("#ts"); 
     var $clone = $target.clone().removeAttr('id'); 
     $clone.val($target.val()).css({ 
      overflow: "auto", 
      position: 'absolute', 
      'z-index': 999, 
      left: $target.offset().left, 
      top: $target.offset().top + $target.outerHeight(), 
      width: $target.outerWidth() 
     }).attr('size', $clone.find('option').length > 10 ? 10 : $clone.find('option').length).change(function() { 
      $target.val($clone.val()); 
     }).on('click blur keypress',function(e) { 
     if(e.type !== "keypress" || e.which === 13) 
      $(this).remove(); 
     }); 
     $('body').append($clone); 
     $clone.focus(); 
    }); 
}); 

は、私が選択した属性を設定することになったオスカー・ハラバリアント
http://jsfiddle.net/mike_s/y5GhB/

Answer 3

少し更新を参照してください。オプションそのもの。 その後、select要素でも変更がトリガーされます。

Answer 4

のために（toggle付き）jsFiddle demo

Answer 5

私は、前のselect要素で与えられた答えによって供給される複合体select要素を持っています。オプションはAJAXによって供給され、onchangeイベントによってトリガーされます。

私の必要に応じて、ユーザーの行動をシミュレートする「隠された魔法のイベント」（集中的なテスト方法で）をプレフィルするには、「私の魔法のイベント」で次のjQueryコードを使用します。注ぐhttps://stackoverflow.com/users/1324/paul-roubà

// Quick feed of my Car Form  
document.getElementById('carbrand').selectedIndex = 30; // "PORSCHE" 
document.getElementById('carbrand').onchange(); 

var timeoutID = window.setTimeout(function() { 

    document.getElementById('model').selectedIndex = 1; // "911" 
    document.getElementById('model').onchange(); 

    var timeoutID = window.setTimeout(function() { 
     document.getElementById('energy').selectedIndex = 1; // "SUPER" 
     document.getElementById('energy').onchange(); 
    } , 200); 

} , 200); 

メルシーレ修正;-)