/// <reference path="jquery-3.3.1.js" />
var functionArray = [$('.img').show, $('.img').hide, $('.img').toggle, $('.img').fadeIn, $('.img').fadeOut, $('.img').fadeToggle];
var buttonArray = [$('.show'), $('.hide'), $('.toggle'), $('.fadein'), $('fadeout'), $('.fadetog')];
var counter = 0;
while (counter < buttonArray.length) {
buttonArray[counter].click(function () {
functionArray[counter]();
})
counter++;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Test</title>
</head>
<body>
<img src="Untitled-1.png" />
<br />
<button class="show">Show</button>
<button class="hide">Hide</button>
<button class="toggle">Toggle</button>
<button class="fadein">Fade in</button>
<button class="fadeout">Fade out</button>
<button class="fadetog">Fade toggle</button>
<script src="Scripts/jquery-3.3.1.js"></script>
<script src="Scripts/Script1.js"></script>
</body>
</html>
我希望每个按钮都可以对图像执行特定的功能,所以我遍历了类数组和函数数组,但这给了我一个错误:
Uncaught TypeError: functionArray[counter] is not a function
at HTMLButtonElement.<anonymous> (Script1.js:8)
at HTMLButtonElement.dispatch (jquery-3.3.1.js:5183)
at HTMLButtonElement.elemData.handle (jquery-3.3.1.js:4991)
这是怎么了?