-5
아래 그림과 같이 js 스피너를 찾고 있습니다 (왼쪽 컨트롤 &). 하지만 내 프로젝트에서 jquery를 사용하고 싶지 않습니다. 스 니펫, 유용한 링크가 있으면 여기에 붙여 넣으십시오. :) 간단한 짧은 코드가 선호됩니다. :) 어쩌면 다른 이름 (회 전자가 아니지만 ..?)?JS 입력 스피너가 있습니까? NO JQUERY
아래 그림과 같이 js 스피너를 찾고 있습니다 (왼쪽 컨트롤 &). 하지만 내 프로젝트에서 jquery를 사용하고 싶지 않습니다. 스 니펫, 유용한 링크가 있으면 여기에 붙여 넣으십시오. :) 간단한 짧은 코드가 선호됩니다. :) 어쩌면 다른 이름 (회 전자가 아니지만 ..?)?JS 입력 스피너가 있습니까? NO JQUERY
function addSpinner(parent){
var very = document.createElement("div"); // create a div
var minus = document.createElement("button"); // create minus button
var plus = document.createElement("button"); // create plus button
minus.innerHTML = "-"; // draw minus sign
plus.innerHTML = "+"; // draw plus sign
var input = document.createElement("input"); // create an input
input.type = "number"; // type number
input.value = "0"; // and default is 0
very.appendChild(minus); // append the minus sign to the div
very.appendChild(input); // append the input to the div
very.appendChild(plus); // append the plus sign to the div
minus.addEventListener("click", function() {input.value = +input.value - 1});
plus.addEventListener("click", function() {input.value = +input.value + 1});
// + before input.value is to change type from string to number so we can increase/decrease number by 1
parent.appendChild(very);
}
지금 당신은 그것을 전화 :
addSpinner(document.body)
그냥 하나의 값과 다른 감소율을 증가 플러스와 마이너스 버튼에 이벤트 핸들러를 클릭하여 연결합니다. – mrogers답변 해 주셔서 감사합니다. 2 개의 간단한 버튼, 입력 필드 및 MutationObserver를 사용하라는 조언이 있습니까? 권리? :) – sameuser
@sameuser Why MutationObserver? 단추에 클릭 이벤트 만 추가하면됩니다. – Oriol