Jquery selectmenu 改变下拉值

Question

我有一个下拉菜单，我用 Jquery UI select 菜单进行了更改。我必须使用 jquery.

更改值

我已经尝试过这个并且它有效。

$('#myId').val('someValue');
$('#myId').selectmenu('refresh');

它正在更改下拉列表值，但未调用与其关联的更改函数。

请查看随附的代码片段，手动更改值时会触发警报，但如果我通过 jquery 进行更改，它只会更新 jquery select 中的值menu ，但它不调用更改功能。请指导我怎么做。

$('#number').selectmenu({
change:function( event, ui ) {alert('Hello')}
});
$('#number').val('3');
$('#number').selectmenu('refresh');

<link href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<html>
  <head>
  
  
  
  
  
  </head>
  <body>
   <select name="number" id="number">
      <option>1</option>
      <option selected="selected">2</option>
      <option value="3">3</option>
      <option>4</option>
      <option>5</option>
      <option>6</option>
      <option>7</option>
      <option>8</option>
      <option>9</option>
      <option>10</option>
      <option>11</option>
      <option>12</option>
      <option>13</option>
      <option>14</option>
      <option>15</option>
      <option>16</option>
      <option>17</option>
      <option>18</option>
      <option>19</option>
    </select>
  
  
  
  </body>
  </html>

)

Answer 1

试试这个。

$('#number').selectmenu();
$('#number').on('selectmenuchange', function() {
    alert( 'Hello'); 
});

$('#number').val(4).selectmenu('refresh').trigger('selectmenuchange');

<link href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css" rel="stylesheet"/>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
    <html>
      <head>
      
      
      
      
      
      </head>
      <body>
       <select name="number" id="number">
          <option>1</option>
          <option selected="selected">2</option>
          <option value="3">3</option>
          <option>4</option>
          <option>5</option>
          <option>6</option>
          <option>7</option>
          <option>8</option>
          <option>9</option>
          <option>10</option>
          <option>11</option>
          <option>12</option>
          <option>13</option>
          <option>14</option>
          <option>15</option>
          <option>16</option>
          <option>17</option>
          <option>18</option>
          <option>19</option>
        </select>
      
      
      
      </body>
      </html>

Jquery selectmenu 改变下拉值

Jquery selectmenu change the dropdown value

javascript

jquery

onchange

jquery-ui-selectmenu