关于为什么阵列无法工作的想法

时间:2015-04-15 20:59:17

标签: javascript

我在项目页面上的链接上切换类,当只使用一个id时,类更改似乎有效,但是当使用数组“myArray”时,没有任何反应。好奇,如果有人有任何想法为什么。这是我正在使用的代码:

var oldpage = $("#oldpage");
var phpscript = $("#phpscript");
var db = $("#db");
var nypl = $("#nypl");
var ppt = $("#ppt");
var myArray = [nypl, db, ppt, phpscript, oldpage];
$(function() {
  var classes = ["paris", "chateau", "violin", "create", "museum"];
  var id = $(myArray);
  var count = 0;

  function nextClass() {
    id.addClass(classes[count = ++count % classes.length]);
    id.removeClass(classes[count = ++count % classes.length]);
    setTimeout(nextClass, 300);
  }
  setTimeout(nextClass, 300);
  id.addClass(classes[0]);
  id.removeClass(classes[0]);
  console.log(id);
});
.paris {
  color: pink;
}
.violin {
  color: rgb(134, 134, 134);
}
.museum {
  color: red;
}
.create {
  color: orange;
}
.chateau {
  color: green;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="projects">
  <li><a href="http://web.simmons.edu/~duffp/lis489/indexver1.html" target="new" class="violin" id="oldpage">First iteration of this page</a>
  </li>
  <br />
  <li><a href="http://web.simmons.edu/~duffp/lis489/php/contactme.txt" target="new" id="phpscript" class="violin">PHP Mail script attached below.</a>
  </li>
  <br />
  <li><a href="http://web.simmons.edu/~duffp/lis489/Dufflibrary.php" target="new" id="db" class="violin">Searchable Database (In progress)</a>
  </li>
  <br />
  <li><a href="http://web.simmons.edu/~duffp/lis403/Duff_Song_Usability_ppt.ppt" target="new" id="nypl" class="violin">NYPL Usability Testing</a>
  </li>
  <br />
  <li><a href="http://web.simmons.edu/~duffp/lis403/Duff_Krim_Song_Evaluation_ppt.ppt" target="new" id="ppt" class="violin">Evaluation of Online Services</a>
  </li>
</ul>
</div>

2 个答案:

答案 0 :(得分:1)

试试这个:

function nextClass() {
    for (var i = 0; i < myArr.length; i++) {
        myArr[i].addClass(classes[count = ++count % classes.length]);
        myArr[i].removeClass(classes[count = ++count % classes.length]);
        setTimeout(nextClass, 300);
    }
}

答案 1 :(得分:0)

我发现添加功能运行得很漂亮。发布以下答案:

&#13;
&#13;
$(function () {
var links = $("#oldpage").add("#phpscript").add("#db").add("#nypl").add("#ppt");
var classes = ["paris" , "chateau" , "violin" , "create" , "museum"];
var count = 0;
	function nextClass () {
		links.addClass(classes[count = ++count % classes.length]);
		links.removeClass(classes[count = ++count % classes.length]);
		setTimeout(nextClass, 30000);
		}
setTimeout(nextClass, 30000);
links.addClass(classes[0]);
links.removeClass(classes[0]);
console.log(links);
});
&#13;
&#13;
&#13;