jQuery UI selectmenu not"选择"

时间:2015-09-03 08:33:36

标签: javascript jquery-ui jquery-ui-selectmenu

我目前正在尝试使用jQuery-UI进行工作选择菜单。我的选择看起来很好,但是当我尝试选择一个值时,没有任何变化:选择保持打开状态,值在悬停时更改,而不是在点击时更改。我根本不了解什么是hapening。

我正在使用jQuery 1.10.2和jQuery-UI 1.11.4。

这是我的(渲染)HTML:

<div class="form-group">
                          <table class="table m-full-background-color-table">
                            <thead>
                              <tr>
                                <th></th>
                                <th>Disposition</th>
                                <th>Participants</th>
                              </tr>
                            </thead>
                            <tbody id="sallesConteneur">
                              <tr class="header-spacing">
                                <td></td>
                              </tr>
                              <tr data-indice="1">
                                <td>Salle de réunion 1</td>
                                <td>
                                  <select class="form-control" name="salles[1][disposition]" id="roomTypeSelect" style="display: none;">
                                    <option value="En U" style="padding-left:30px;background-image: url('/images/capacity_icons/IconesBizMeeting_14.gif');">En U</option>
                                    <option value="Banquet">Banquet</option>
                                    <option value="Cocktail">Cocktail</option>
                                    <option selected="selected" value="Theatre">Theatre</option>
                                    <option value="Board">Board</option>
                                    <option value="Conference">Conférence</option>
                                    <option value="Class">Classe</option>
                                  </select><span class="ui-selectmenu-button ui-widget ui-state-default ui-corner-all" tabindex="0" id="roomTypeSelect-button" role="combobox" aria-expanded="false" aria-autocomplete="list" aria-owns="roomTypeSelect-menu" aria-haspopup="true" style="width: 210px;" aria-activedescendant="ui-id-7" aria-labelledby="ui-id-7" aria-disabled="false"><span class="ui-icon ui-icon-triangle-1-s"></span><span class="ui-selectmenu-text">Classe</span></span>
                                </td>
                                <td>
                                  <input type="number" min="0" value="13" class="form-control input-sm" name="salles[1][participants]">
                                </td>
                              </tr>

                            </tbody>
                          </table>

                          <span><a class="btn btn-primary pull-right" id="newSalle" alt="" href="#"><i class="fa fa-plus"></i> Ajouter une salle</a><span class="light-text small-text pull-right l-tip">Vous souhaitez plusieurs salles ? Cliquez sur le bouton ci-contre</span></span>
                        </div>

这是我的javascript代码(在$(function(){中):

$.widget( "custom.iconselectmenu", $.ui.selectmenu, {
  _renderItem: function( ul, item ) {
    var li = $( "<li>", { text: item.label } );

    if ( item.disabled ) {
      li.addClass( "ui-state-disabled" );
    }

    $( "<span>", {
      style: item.element.attr( "data-style" ),
      "class": "ui-icon " + item.element.attr( "data-class" )
    })
      .appendTo( li );

    return li.appendTo( ul );
  }
});
$("#roomTypeSelect").iconselectmenu().iconselectmenu("menuWidget").addClass("ui-menu-icons");

有没有人知道它为什么不起作用?

谢谢, 祝你有愉快的一天

1 个答案:

答案 0 :(得分:1)

确实谢谢你@blgt,jquery-ui.structure.min.css显然已经失踪了。 哑误区:(