1

我试过atooltip,它给了我一个可点击的工具提示,我能够设置一个jQuery UI Multiselector作为它的内容。

        jQuery1_9('.fixedHeader tr').first().find('th').first().aToolTip({
          clickIt: true,
          tipContent: '<select class="test" multiple="multiple">' +
                        '<option>Test1</option>' +
                        '<option>Hello</option>' +
                        '<option>1F</option>' +
                      '</select>',
          onShow: function () {
            jQuery1_9(".test").multiselect();
          }
        });

但是,工具提示始终会创建和销毁其内容,并且不会保存多选状态。

我正在寻找一种解决方案,在该解决方案中,我具有类似于工具提示的功能,具有持久的交互式 HTML 内容。

弹出对话框不是一个选项。

4

1 回答 1

0

我使用qTip2找到了解决问题的方法找到了解决问题的方法。

我正在创建这个隐藏的选择器:

<select class="test" multiple="multiple">
   <option>Test1</option>
   <option>Hello</option>
   <option>1F</option>
</select>

然后我调用多选操作并隐藏整个事情:

    $(".test").multiselect()
    $('.ui-multiselect').hide();
    $('.ui-multiselect-close').hide(); // the default close-button is not wanted

对于包含多选器小部件的 qTip,然后我使用以下选项:

    $('.selector').qtip({
        content: {
            text: $(".test").multiselect("widget"), // display the widget
            button: 'Close'
        },
        position: {
            my: 'top center',
            at: 'bottom center'
        },
        hide: {
            event: false
        },
        show: {
            event: 'click'
        }
    });

结果是一个非常漂亮的、交互式的、小型的、类似于工具提示的窗口,其中包含 jQuery UI 多选器。(抱歉,暂时还不能发图片。)

于 2013-10-08T22:55:11.730 回答