我正在创建一个使用html属性以交互方式显示链接信息的系统,并且jQuery可以移动一些HTML。我被困在尝试将标题属性附加到div 中。我从来没有用属性做过这件事,并且正在碰壁。
这很难解释,但是当你看到JS时,你会看到我所追求的。http://jsfiddle.net/KvAwa/
提前感谢任何帮助
该目录
<div id="navtool">
<ul id="menu">
<li id="1">
<a href="location1.html" title="this is the decription1">This is the link1</a>
</li>
<li id="2">
<a href="location2.html" title="this is the decription2">This is the link2</a>
</li>
<li id="3">
<a href="location3.html" title="this is the decription3">This is the link3</a>
</li>
</ul>
</div>
<a href="#" class="prev nav">prev</a>
<a href="#" class="next nav">next</a>
<div id="linkdesciption"></div>
<a href="#" id="execute">Execute link</a>
JS的
// Cycles Menu
$('#menu > li:first').addClass('active');
$('.next').click(function(){
$('.active').next().addClass('active').prev().removeClass('active');
$('#menu > li:last').after($('#menu > li:first'));
});
$('.prev').click(function(){
$('.active').prev().addClass('active').next().removeClass('active');
$('#menu > li:first').before($('#menu > li:last'));
});
// Collects the link
var executeLink = $('#menu > li.active > a').attr("href");
$('#execute').attr("href", executeLink);
$('#execute').click(function(){
alert(executeLink);
});
// Collects title and inject into description
$('.nav').click(function(){
var description = $('.active > a').attr('title');
$(description).appendTo('#linkdesciption');
});
我认为该代码的相关部分是:
$('.nav').click(function(){
var description = $('.active > a').attr('title');
$(description).appendTo('#linkdesciption');
});
你想扭转局面:
$('.nav').click(function(){
var description = $('.active > a').attr('title');
$('#linkdesciption').append(description);
});
更新的小提琴
或者,如果要将以前的链接标题替换为新链接标题,请使用html
或text
而不是append
:
$('.nav').click(function(){
var description = $('.active > a').attr('title');
$('#linkdesciption').text(description);
});
更新的小提琴
如果我
理解正确,请尝试这个小提琴:http://jsfiddle.net/arvind07/KvAwa/1/