Question

好的，所以需要通过jquery更改链接。下面的代码工作正常，但它立即行动。我需要链接仅在下一次单击时变为活动状态，而不是当前单击。希望有道理吗？

任何帮助表示感谢。

 $("#m-menu").click(function(){
$("#menu").animate({right: 0}, 500, "easeInOutCirc");
$(this).text($(this).text() == 'HOME' ? 'HOME' : 'HOME');
$(this).attr('href', 'http://backtohomepage.com');
 });

编辑：感谢所有答案的人 - 它不像每个其他点击解决方案那么简单，并且为第一次不清楚而道歉。这是源页面（我没有将上述.attr代码应用于此以便更好地说明我的要求）：http://joinersart.co.uk/mtest

基本上，当用户点击左/右箭头导航库时，您会看到菜单栏缩小。要将其取回，请单击“MENU”。一旦再次退出，“MENU”文本将更改为“HOME”并启用新功能 - 链接到主页。当然，如果再次单击左/右箭头，它会切换回“MENU”并将其功能更改回扩展菜单栏。所以基本上这个链接有两个功能（作为主页链接 - “HOME”，或者作为菜单栏扩展器 - “MENU”），具体取决于菜单栏是伸出还是塞进去。

当我尝试应用上面的.attr代码时，会发生这种情况 - 用户点击“菜单”链接而不是菜单栏扩展，它们会立即进入主页。所以它会很快激活链接执行.click功能。我需要做的是扩展菜单栏并首先将文本从“MENU”更改为“HOME”。只有当用户点击它时，它们才会进入主页。

Answer 1

$('#m-menu').click(function () {
    // Do the work here
    $(this).unbind('click');
    $(this).click(function () {
          $(this).attr('href', 'http://backtohomepage.com');
    })
})

Answer 2

你可以这样做：

$("#m-menu").one('click', function (){
    $("#m-menu").click(function(){
        $("#menu").animate({right: 0}, 500, "easeInOutCirc");
        $(this).text($(this).text() == 'HOME' ? 'HOME' : 'HOME');
        $(this).attr('href', 'http://backtohomepage.com');
    });
});

http://api.jquery.com/one/

Answer 3

你是说这个？

var nbclicks = 0;
$("#m-menu").click(function(){
     $("#menu").animate({right: 0}, 500, "easeInOutCirc");
     if (nbclicks++==1) {
          $(this).text($(this).text() == 'HOME' ? 'HOME' : 'HOME');
          $(this).attr('href', 'http://backtohomepage.com');
     }
 });

Answer 4

您希望点击每次点击一次吗？

如果是这种情况，那么你可以这样做

$(function() {
    var counter = 0;
    $("#m-menu").click(function(){
        counter ++;
        if( counter % 2 == 0){
            $("#menu").animate({right: 0}, 500, "easeInOutCirc");
            $(this).text($(this).text() == 'HOME' ? 'HOME' : 'HOME');
            $(this).attr('href', 'http://backtohomepage.com');
        }
     }); 

 });

这将确保您的代码在每次偶数点击时执行

JQuery：更改href链接，但仅限下次点击

4 个答案: