jQuery-UI自动完成功能,可在自动下拉列表选择中显示div

时间:2016-08-21 23:47:55

标签: jquery jquery-ui autocomplete z-index

我有这个jQuery UI设置。

$.widget("app.autocomplete", $.ui.autocomplete, {
    _create: function() {
      if(this.element.is("select")) {
        var self = this;
        this.original = this.element.hide();
        this.element = $("<input/>").insertAfter(this.original);
        this.options.source = function(request, response) {
          var filter = $.ui.autocomplete.filter,
            $options = self.original.find("option"),
            result = $options.map(function() {
              return $(this).html();
            });
          response(filter(result, request.term));
        };
      }
      this._super("_create");
    },
    _destroy: function() {
      this._super("_destroy");
      this.element.remove();
      this.original.show();
    }
  });
  $(function() {
    $("#autocomplete").autocomplete();
  });
});

我试图在单击自动填充选择时简单地触发我的模态或显示我的div。我尝试了下面的内容,并尝试过使用其他各种标签。什么都行不通。有什么建议吗?

$('.ui-menu ui-widget .ui-widget-content .ui-autocomplete .ui-front').click(function(event) {
      $(".state_overlay").show();  
    // $('li.ui-menu-item').innerhtml().append.$("h2.statename"); /* edit */
});

注意:我的jquery-UI生成的选择器似乎都没有使用点击功能?

我的自动完成标记看起来像这样:

<select id="autocomplete" class="autocomplete">
    <option value="">Select State</option>

0 个答案:

没有答案