如何通过id获取可变数据

时间:2017-10-28 18:01:41

标签: javascript slider

最近我在项目中使用的代码仍在使用http://kreditka.testovi-site.pw。但是当我试图重用javascript时,默认规则js被破坏了,我在控制台中得到一个错误,说明无法找到varibale。它是否与某些方面有关,代码是不可重复使用的,并且每一行都应该为不同的项目逐一重写?

(function () {

    console.log("()");
    "use strict";
    var polosa = document.querySelector("#polosa");
    alert(polosa);
    var x = document.querySelectorAll("#slide1");
    var o;
    for (o = 0; o < x.length; o++) {
        x[o].style.left = o*300+"px";
    }

    var x = document.querySelectorAll("#slide");
    var a;
    for (a = 0; a < x.length; a++) {
        x[a].style.left = a*300+"px";
    }

    var doc = document.querySelectorAll('.btn-click');
    for (var i = 0; i < doc.length; i++) {
        doc[i].addEventListener("click", highlightThis, true);
    }

    var doc1 = document.querySelectorAll('.btn1-click');
    for (var j = 0; j < doc.length; j++) {
        doc1[j].addEventListener("click", highlightThis1, true);
    }

    var polosa = document.querySelector('#polosa');
    polosa.style.left = '0px';
    var left = 0;
    var sliderItem = document.querySelector('#slide');

    function highlightThis(event) {
        console.log("highlightThis");
        var currentActiveButton = document.querySelector(".btn-click.btn-slide-active");
        currentActiveButton.classList.toggle("btn-slide-active");
        event.target.classList.toggle("btn-slide-active");
        console.log(event.target.dataset.value);
        shiftSlide({
            prev: currentActiveButton.dataset.value,
            next: event.target.dataset.value
        });
    }
    function highlightThis1(event) {
        console.log("highlightThis1");
        var currentActiveButton1 = document.querySelector(".btn1-click.btn-slide-active");
        currentActiveButton1.classList.toggle("btn-slide-active");
        event.target.classList.toggle("btn-slide-active");
        console.log(event.target.dataset.value);
        shiftSlide1({
            prev: currentActiveButton1.dataset.value,
            next: event.target.dataset.value
        });
    }

    function shiftSlide(obj) {
        var polosa = document.querySelector('#polosa');
        console.log("shiftSlide");
        var currentSliderPosition = parseInt(polosa.style.left);
        if (obj.prev === obj.next) {
            return
        } else {
            var left = (obj.prev - obj.next) * 300;
            polosa.style.left = currentSliderPosition + left + "px";
        }

    }
    function shiftSlide1(obj) {
        var polosa = document.querySelector('#polosa1');
        console.log("shiftSlide");
        var currentSliderPosition = parseInt(polosa1.style.left);
        if (obj.prev === obj.next) {
            return
        } else {
            var left = (obj.prev - obj.next) * 300;
            polosa1.style.left = currentSliderPosition + left + "px";
        }
    }

})();

0 个答案:

没有答案