jQuery UI工具提示,不包括选择标签不起作用

时间:2013-06-21 19:56:40

标签: jquery jquery-ui jquery-tooltip jquery-ui-tooltip

我正在使用jQuery UI工具提示小部件,它似乎打破了Internet Explorer中的选择标记。所以我从初始化中排除了select标签。但是,这似乎不起作用,因为Internet Explorer中现在缺少所有增强的工具提示。

这是我之前没有使用IE选择标签的原因:

<script>j(document).tooltip();</script>

现在我转而使用此代码。 j(document).not("select")会阻止增强的工具提示显示。如何使此代码生效?

<!--[if IE]>
    <script>j(document).not("select").tooltip();</script>  <-- Doesn't Work
<![endif]-->
<!--[if !IE]>
    <script>j(document).tooltip();</script>
<![endif]-->

我也试过这个thread的代码,但它仍然没有用。没有任何jQuery UI工具提示在任何浏览器中显示。

<!--[if IE]>
    <script>j('*').tooltip(); j('select').tooltip('disable');</script>
<![endif]-->
<!--[if !IE]>
    <script>j(document).tooltip();</script>
<![endif]-->


更新

我试过了,回到了我开始的地方:

<script>j('*').tooltip();</script>
<!--[if IE]>
<script>j('select').tooltip('disable');</script>
<![endif]-->

3 个答案:

答案 0 :(得分:0)

这很丑陋,但你可以在所有浏览器中设置你的选择器字符串,在IE中覆盖,然后实际调用它。

<script>
    var tooltipSelector = "*";
</script>
<!--[if IE]>
<script> tooltipSelector = ":not(select)"</script>
<![endif]-->
<script>
    $(tooltipSelector).tooltip();
</script>

旁注:$(document).not("select").tooltip()选择文档,然后从集合中删除不是select元素的所有元素(这些元素都是它们,因为它只是一个文档),然后尝试创建工具提示在你的(现在为空)集上。这是一个昂贵的无操作。

答案 1 :(得分:0)

在javascript解决方案中尝试条件标记:

var ie = (function(){

    var undef,
        v = 3,
        div = document.createElement('div'),
        all = div.getElementsByTagName('i');

    while (
        div.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
        all[0]
    );

    return v > 4 ? v : undef;

}());

j(function(){

    if(!ie){

        //ie will be undefined if a different browser than IE is used
        //otherwise it will return the IE version
        //handle IE here

    }
    else {

        //handle the rest of the browsers here
    }

});

答案 2 :(得分:0)

$(function(){
    $("*").each(function(i, el){
        $(el).attr("mytitle", $(el).attr("title")).removeAttr("title");
    });

    $("*").tooltip({
        items: "[mytitle]:not([disabled])",
        content: function() {
            return $(this).attr("mytitle");
        }
    });
});