组阵列的内容跨度标签的标题使用jQuery

我有一个这样的数组：组阵列的内容跨度标签的标题使用jQuery

var name = ["cat","shark","tiger","snake"];

我想设置阵列的内容<span>称号。

HTML代码：

<ul id="select"> 
    <li class="ui-state-default"><span>CAT</span></li> 
    <li class="ui-state-default"><span>SHARK</span></li> 
    <li class="ui-state-default"><span>TIGER</span></li> 
    <li class="ui-state-default"><span>SNAKE</span></li> 
</ul>

jQuery代码：

for(var i=0; i<=name.length; i++){ 
     $('#select li > span').each(function() { 
     this.title = name[i]; 
     }); 
    };

但是这个代码不工作。跨度的标题是未定义的。

来源

2013-03-09 prince

将数组跨越跨度和没有任何意义。 i <= name.length也意味着您将始终循环过阵列（应为<）。这意味着您实际上将每个跨度的标题设置为不存在的数组元素。

$('#select li > span').each(function(i) { 
    $(this).attr('title', name[i]); 
});

您可能还想确认name[i]的存在。

http://jsfiddle.net/wtbE5/

来源

2013-03-09 17:13:16

如果title你指的是span的文本，我建议：

$('#select li span').text(function(i){ 
    return name[i]; 
});

JS Fiddle demo。

或者，如果你想设置标题属性，我建议：

$('#select li span').attr('title',function(i){ 
    return name[i]; 
});

JS Fiddle demo。

来源

2013-03-09 17:11:48

感谢，但是还是不行.... – prince 2013-03-09 17:17:13

*不起作用*在哪里？在小提琴？（它确实。）在你的页面？还有什么正在阻止它呢？ JavaScript控制台中的任何错误？你能在[JS小提琴]（http://jsfiddle.net/）重现你的问题吗？你是否将代码封装在'$（document）.ready（function（）{/ *你的代码在这里* /}）;'？什么“不起作用”甚至意味着什么？它以什么方式不起作用？ *你期望的*是什么，它不会这样做？ – 2013-03-09 17:18:23

感谢您的注意....在我的页面中，我已经包装了$（document）.ready（function（）{}）中的代码; – prince 2013-03-09 17:25:32

尝试：

$('#select li span').each(function(i){ 
    $(this).html(name[i]); 
});

Sample

来源

2013-03-09 17:13:28 Anujith

谢谢....它的工作 – prince 2013-03-09 17:22:05

组阵列的内容跨度标签的标题使用jQuery

回答

相关问题