如何在点击时更改锚点的href属性值

时间:2015-06-04 19:03:04

标签: jquery html

我正在使用以下代码链接到页面上的某个部分。

        sc = new Scanner(System.in);

        while(sc.hasNextLine()){

             String number = sc.next();
             String name = sc.next();
             int numberI = Integer.parseInt(number);
             Usage usage = new Usage(name);
             computerNames[numberI].addObsseration(usage);

        }
        sc.close();

链接位于屏幕右下方的绝对位置; 有没有办法可以更改点击链接?因此,当您点击$('a[href^="#"]').on('click', function (event) { var target = $(this.href); if (target.length) { event.preventDefault(); $('html, body').animate({ scrollTop: target.offset().top }, 1000); } }); <a href="#group1" class="save">Save 20%</a> 时,它会滚动到该部分,然后相同的链接变为<a href="#group1",然后变为#group2,

2 个答案:

答案 0 :(得分:0)

This fiddle应该可以做到这一点。

我抓住当前的href值,将其递增1并替换它:

$('a[href^="#"]').on('click', function (event) {
    var target = $(this.href);
    if (target.length) {
        event.preventDefault();
        $('html, body').animate({
            scrollTop: target.offset().top
        }, 1000);
    }
    var idx = $(this).attr('href').slice(6);
    var newIdx = (idx)%3+1;
    $(this).attr("href",'#group'+newIdx);
});

您可以在鼠标悬停时看到链接正在发生变化(您必须离开并重新开启以查看大多数浏览器中的更改)。

答案 1 :(得分:0)

HTML

<a href="javascript:void(0);" data-href="#group1" class="save">Save 20%</a>

<div id="group1"></div>
<div id="group2"></div>
<div id="group3"></div>

JS

var i=1;
$('a').on('click', function (event) {
    i++;
    var anchor = $(event.target);
    var target = $($(event.target).data("href"));
    console.log(target);
    event.preventDefault();
    $('html, body').animate({
        scrollTop: target.offset().top
    }, 1000);
    anchor.data("href","#group"+i);
});

回答小提琴上的现场工作http://jsfiddle.net/rLpez4sp/1/

您可以在Javascript控制台上查看链接更改。