Javascript 如何使用jQuery在单击按钮时触发函数
大家好，我在jQuery中创建了一个函数，如下所示：Javascript 如何使用jQuery在单击按钮时触发函数,javascript,jquery,Javascript,Jquery,大家好，我在jQuery中创建了一个函数，如下所示： i = 0; j = 0; setInterval(function() { if (i < 15) { secondPlay(); i++; }}, 1000); setInterval(function() { if (j < 15) { secondPlay1(); j++; }}, 1000); function secondPlay() { $("body").removeClas
i = 0;
j = 0;
setInterval(function() {
if (i < 15) {
secondPlay();
i++;
}}, 1000);
setInterval(function() {
if (j < 15) {
secondPlay1();
j++;
}}, 1000);
function secondPlay() {
$("body").removeClass("play");
var aa = $("ul.secondPlay li.active");
var ii = $('ul.secondPlay li:last-child').val();
if (aa.html() == undefined) {
aa = $("ul.secondPlay li").eq(0);
aa.addClass("before")
.removeClass("active")
.next("li")
.addClass("active")
.closest("body")
.addClass("play");
}
if (aa.is(":last-child")) {
$("ul.secondPlay li").removeClass("before");
aa.addClass("before").removeClass("active");
aa = $("ul.secondPlay li").eq(0);
aa.addClass("active")
.closest("body")
.addClass("play");
}
else {
$("ul.secondPlay li").removeClass("before");
aa.addClass("before")
.removeClass("active")
.next("li")
.addClass("active")
.closest("body")
.addClass("play");
}
}
function secondPlay1() {
$("body").removeClass("play");
var aa = $("ul.secondPlay1 li.active");
if (aa.html() == undefined) {
aa = $("ul.secondPlay1 li").eq(0);
aa.addClass("before")
.removeClass("active")
.next("li")
.addClass("active")
.closest("body")
.addClass("play");
}
else if (aa.is(":last-child")) {
$("ul.secondPlay1 li").removeClass("before");
aa.addClass("before").removeClass("active");
aa = $("ul.secondPlay1 li").eq(0);
aa.addClass("active")
.closest("body")
.addClass("play");
}
else {
$("ul.secondPlay1 li").removeClass("before");
aa.addClass("before")
.removeClass("active")
.next("li")
.addClass("active")
.closest("body")
.addClass("play");
}
}
<ul class="flip secondPlay">
<li class="">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">0</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">0</div>
</div>
</a>
</li>
<li class="" value="0">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">7</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">7</div>
</div>
</a>
</li>
<li class="" value="1">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">4</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">4</div>
</div>
</a>
</li>
<li class="" value="2">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">7</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">7</div>
</div>
</a>
</li>
<li class="" value="3">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">5</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">5</div>
</div>
</a>
</li>
<li class="" value="4">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">6</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">6</div>
</div>
</a>
</li>
<li class="" value="5">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">3</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">3</div>
</div>
</a>
</li>
<li class="" value="6">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">2</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">2</div>
</div>
</a>
</li>
<li class="" value="7">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">1</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">1</div>
</div>
</a>
</li>
<li class="" value="8">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">6</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">6</div>
</div>
</a>
</li>
<li class="" value="9">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">8</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">8</div>
</div>
</a>
</li>
<li class="" value="10">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">2</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">2</div>
</div>
</a>
</li>
<li class="" value="11">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">1</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">1</div>
</div>
</a>
</li>
<li class="" value="12">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">9</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">9</div>
</div>
</a>
</li>
<li class="before" value="13">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">7</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">7</div>
</div>
</a>
</li>
<li class="active" value="14">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">7</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">7</div>
</div>
</a>
</li>
<li value="15">
<a href="#">
<div class="up">
<div class="shadow"></div>
<div class="inn">8</div>
</div>
<div class="down">
<div class="shadow"></div>
<div class="inn">8</div>
</div>
</a>
</li>
</ul>
您还可以共享一个JSFIDLE吗？$document.on'click'、'trigger'，函数{do stuff when clicked}？问题的第二部分**我想在两个div中都显示值2如何实现**不清楚。我可以在上面的问题中看到相当复杂的jquery代码。那么点击按钮有什么大不了的？这个问题呢？
<div class="buttons">
<button id="trigger">Result!</button>
</div>
setInterval(function() {
if (i < 15) {
secondPlay();
i++;
}}, 1000);