Question

编辑A：这不是一个jquery问题，而是一个 jquery Mobile 问题。

编辑B：我更改了标题...最初我问过如何专门触发“点击”事件，但显然“点击”事件不是您要使用的正确事件重新创建一个jqm：选择菜单选项。

如何以编程方式在jquery移动选择菜单上触发事件？

<select id       = 'my_select'   
        name     = 'my_select'   
        onchange = 'gf_handle_change( this.value );' >
  <option id = 'option_A'  value = 'A'> A </option>
  <option id = 'option_B'  value = 'B'> B </option>
</select>

<script>
  function gf_fire_event( args_val )
    { alert( 'test : ' + jQuery( '#option_' + args_val ) ) ; 
      jQuery( '#option_' + args_val ).trigger( 'click' ) ;
    }
  function gf_handle_change( args_val )
    { alert( args_val )  ;
    }
  gf_fire_event( 'A' ) ;
</script>

这不起作用。

Answer 1

以下是一个例子：

$(document).on('pagebeforeshow', '#index', function(){       
    $("#test-button").on( "click", function(event, ui) {
      $('#my_select option#option_B').trigger('click');    
    });

    $("#my_select option").each(function(){
        $(this).on( "click", function(event, ui) {
          $(this).attr('selected' , true);
          $('#my_select').selectmenu('refresh');                
        });         
    });    
});

使用jsFiddle示例：http://jsfiddle.net/Gajotres/RZ68b/

还有一件事，不要使用onclick =“...或onchange =”...使用jQuery Mobile，这可能会导致事件触发的问题。始终以编程方式绑定您的事件。

Answer 2

那就行了

function gf_fire_event( args_val )
{
    //Select an option
    $('#my_select option[value=' + args_val +']').attr("selected", "selected");
    //Refresh jQM select menu
    $('#my_select').selectmenu('refresh');
    //Trigger change event
    $('#my_select').trigger('change');
}

见工作jsFiddle

jquery mobile：在jqm选择菜单上以编程方式触发事件的正确方法是什么

2 个答案: