jQuery UI 对话框不会在 <select> 单击时打开

Question

当用户单击选择选项时，我正在尝试打开 jQuery UI 对话框：

<select id="js-test" name="product_combination[<?php echo $combination_row; ?>][product_colour_sizes_option_value_colour_id]"  > 
   <?php 
      foreach($list_of_colours as $acolour){
   ?>

<option value="<?php echo $acolour['id']; ?>" 
   id="<?php echo $acolour['id']; ?>"
   <?php 
    if($acolour['id'] == $product_combination['product_colour_sizes_option_value_colour_id']){ 
   ?> selected="selected" <?php } ?> >
   <?php echo $acolour['name'] ?>
</option>
   <?php } ?>
</select>

我的对话框在上面几行：

<!-- Start Dialog Box Here -->
  <div id="myDialog" title="Size Selection">
     <div class="box" style="display:none;">
        I am Dailog
     </div>
  </div>
<!-- /end Dialog Box -->

我的 jQuery 代码在一个外部文件中：

$(document).ready(function(){
//$("#myDialog").dialog({autoOpen:false});

$("#myDialog").dialog({
    autoOpen:false,
    height:300,
    width:400,
    modal: true
});

$("#js-test").click(function(){
    $("#myDialog").dialog("open");
    var selection = $('#js-test').find(':selected').text();
    console.log(selection);

  });
});

我的控制台日志会显示在控制台日志中，就像单击我的选择选项时所期望的那样。但是我的对话框仍然没有显示。有谁知道这是为什么？

Answer 1

原来我需要在通话后放置我的对话框！已解决。