[英]I can't increase variable's value when button clicked
我只想这样做:(索引++或索引-单击按钮时),但它的值没有改变(始终为零)。 我认为我无法转移一些价值。 它必须增加还是减少? 有两个功能。 一种是增加我的索引变量,另一种是减少它。 但最终索引保持为0。
$(document).ready(function () {
"use strict";
const carousel_baslik = $(".carousel-baslik")[0];
const carousel_metin = $(".carousel-metin")[0];
const carousel_image = $(".carousel-image")[0];
const counter = $("#counter")[0];
const icon = $("#icon-ground")[0];
const controller1 = $(".carousel-controller")[0];
const controller2 = $(".carousel-controller")[1];
var index = 0;
class Request {
get(url) {
return new Promise((resolve, reject) => {
fetch(url).then(res => res.json()).then(data => resolve(data)).catch(err => reject(err));
})
}
}
const Requesting = new Request();
Requesting.get("js/carousel.json").then(data => {
const slides = data.length;
controller1.addEventListener("click", function (slideCount) {
geri(slides);
});
controller2.addEventListener("click", function (slideCount) {
ileri(slides);
});
add(data);
});
function geri(slideCount) {
index--;
showSlides(slideCount);
console.log("index:" + " " + index);
console.log("slideCount:" + " " + slideCount);
}
function ileri(slideCount) {
index++;
showSlides(slideCount);
console.log("index:" + " " + index);
console.log("slideCount:" + " " + slideCount);
}
function showSlides(slideCount) {
index = slideCount;
if (index < 0) {
index = slideCount - 1;
}
if (index >= slideCount) {
index = 0;
}
// console.log(index);
}
function add(data) {
carousel_baslik.textContent = data[index].baslik;
carousel_metin.innerHTML = data[index].metin;
carousel_image.src = data[index].image;
counter.textContent = data[index].count;
const img = document.createElement("img");
img.src = data[index].icon;
img.className = "w-100";
img.alt = "";
icon.appendChild(img);
}
});
结果:总是索引0
我的最后一次编辑(索引增加和减少,但数据未添加到HTML):
$(document).ready(function () {
"use strict";
const carousel_baslik = $(".carousel-baslik")[0];
const carousel_metin = $(".carousel-metin")[0];
const carousel_image = $(".carousel-image")[0];
const counter = $("#counter")[0];
const icon = $("#icon-ground")[0];
const controller1 = $(".carousel-controller")[0];
const controller2 = $(".carousel-controller")[1];
var index = 0;
class Request {
get(url) {
return new Promise((resolve, reject) => {
fetch(url).then(res => res.json()).then(data => resolve(data)).catch(err => reject(err));
})
}
}
const Requesting = new Request();
Requesting.get("js/carousel.json").then(data => {
controller1.addEventListener("click", geri);
controller2.addEventListener("click", ileri);
add(data);
});
function add(data) {
carousel_baslik.textContent = data[index].baslik;
carousel_metin.innerHTML = data[index].metin;
carousel_image.src = data[index].image;
counter.textContent = data[index].count;
const img = document.createElement("img");
img.src = data[index].icon;
img.className = "w-100";
icon.appendChild(img);
}
function geri() {
index--;
console.log(index);
}
function ileri() {
index++;
console.log(index);
}
});
您正在增加和减少index
,但是此后不久,您将它设置回showSlides
函数中,当您设置index = slideCount
,所有工作都将丢失。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.