概述
按照要求,我想更新一个现有的小标题,但似乎不起作用.情况HTML:<ul><liid="li1">Pointatme(title->value)</li><liid="li2">Pointatme(title->callback)</li><liid="li3"original-title="F情况
HTML:
<ul>
<li ID="li1">Point at me (Title -> value)</li>
<li ID="li2">Point at me (Title -> callback)</li>
<li ID="li3" original-Title="Foobar1">Point at me (Title -> HTML attribute)</li>
</ul>
<button>Click me to update</button>
Js:
$('#li1').tipsy({
Title: 'Foobar1'
});
$('#li2').tipsy({
Title: function() { return 'Foobar1'; }
});
$('#li3').tipsy();
$('button').click(function() {
alert('Updating tipsy Titles');
// Try setting Title attribute
$('li1')[0].setAttribute('Title', 'Foobar2');
$('li2')[0].setAttribute('Title', 'Foobar2');
$('li3')[0].setAttribute('Title', 'Foobar2');
// Try setting original-Title attribute
$('li1')[0].setAttribute('original-Title', 'Foobar2');
$('li2')[0].setAttribute('original-Title', 'Foobar2');
$('li3')[0].setAttribute('original-Title', 'Foobar2');
});
您可以在Jsfiddle中玩这个:http://jsfiddle.net/TvFmG/3/
我遇到以下问题:
>通过tipsy({Title:’string’})设置标题似乎根本不起作用.
> tipsy docs建议可以通过设置original-Title属性来更新标题值(请参阅“动态更新文本”部分),但在我看来似乎不起作用(请参阅Jsfiddle).
棘手的文档是否纯属错误,是否存在某些版本不兼容或其他导致该示例无法正常工作的问题?
解决方法:
据我所知,该文档似乎是正确的并且可以正常工作.
.tipsy({Title: 'attribute'})
用于查找元素上的属性,并从中进行细化.默认值为标题属性.因此,对于问题中的示例:
$('#li1').tipsy({
Title: 'Foobar1'
});
这试图在#li1上找到一个名为Foobar1的属性,该属性不存在. tipsy将寻找的默认属性是Title属性.因此,您需要类似:
<li ID="li1" Title="hooray!">Point at me (Title -> value)</li>
<li ID="li1" Foobar1="Title from a custom attribute">Point at me (Title -> value)</li>
$('#li1').tipsy({
Title: 'Foobar1'
});
对于通过问题的单击部分进行的设置,此行上的JavaScript中有一个错误(尽管出于相同的原因,下一行也会发生相同的错误).
$('li1')[0].setAttribute('Title', 'Foobar2');
选择器缺少开头的#,因此jquery找不到您的元素.应该是$(‘#li1’),$(‘#li2’)等…
但是,只有在尚未覆盖每个常用构造函数中的标题的情况下,以这种方式设置标题才有效.因此,在这种情况下,您的代码只能与li3一起使用,因为其他代码具有自定义标题函数,该函数始终返回Foobar1.
完整示例:
<li ID="li3" original-Title="Foobar1">Point at me (Title -> HTML attribute)</li>
$('#li3').tipsy();
将返回Foobar1.然后调用$(‘#li3’)[0] .setAttribute(‘Title’,’Foobar2′);它将返回Foobar2.
总结
以上是编程之家为你收集整理的javascript-jQuery Tipsy:动态更新标题全部内容,希望文章能够帮你解决javascript-jQuery Tipsy:动态更新标题所遇到的程序开发问题。
如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。