使用多个变量更改href onclick

Question

我对js知之甚少，所以请保持谦虚。

我正在使用下面的代码，该代码最初是用来交换类的。 我以为那就像将.className更改为.href一样简单，但是我错了。

我的问题是，它只能运行一次然后停止。

$(document).ready(function(){
  $('#click').click(function () {
    $('#url').each(function(){
      var classes = ['/1','/2','/3','/4'];
      this.href = classes[($.inArray(this.href, classes)+1)%classes.length];
    });
  });
});

编辑：这是我正在使用的html：

<a id="url" href="/0">hello</a>

我的目标是在每次onclick时将/ 1切换为/ 0，然后将/ 2切换为依此类推。

Answer 1

您可以使用.attr() ，将变量设置为-1 。 click事件处理程序时，将变量递增，直到变量达到classes.length为止，然后将变量重置为0 ，而不使用Remainder运算符。

 $(document).ready(function() { var classes = ['/1','/2','/3','/4']; var i = -1; var url = $("#url"); $('#click').click(function () { i = (++i < classes.length) ? i : 0; url.attr("href", classes[i]); console.log(url.attr("href")); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> </script> <button id="click">click</button> <a id="url" href="/0">hello</a> 

Answer 2

失败是因为协议file://或http://被静默添加了href值。

所以改变这个：

$.inArray(this.href, classes)

至：

$.inArray(this.href.replace(/^.*?\/\//, ''), classes)

...会从字符串中删除协议，然后再在数组中查找协议。