반응형
두 가지 방식이 있다.
class 를 추가하는 방식, 타임아웃을 걸어주는 방식이 있는데, multi handle 의 경우 class 를 추가하는 방식이 좀 더 편하다.
var DELAY = 700, clicks = 0, timer = null;
$(function () {
$("button")
.on("dblclick", function (e) {
e.preventDefault(); //cancel system double-click event
});
});
window.onload = () => {
const all_btns = document.querySelectorAll('button');
for (var i = 0; i < all_btns.length; i++) {
all_btns[i].addEventListener('click', function (e) {
speech(e["srcElement"])
console.log(e)
});
}
}
function clickHandle(obj, place) {
var $this = $(obj);
if ($this.hasClass('clicked')) {
goto(place)
//here is your code for double click
// return;a
} else {
$this.addClass('clicked');
speech(obj)
//your code for single click
setTimeout(function () {
$this.removeClass('clicked');
}, 500);
}//end of else
}
function speech(obj) {
//one click
var is = true;
var iTimeout = 500; //500/1000 초 이 값을 조절하면 더블클릭까지 기다릴 시간을 조정할 수 있음
eval("obj._fnOnClick = function () { return(click_event(obj)) }");
obj._timeoutid = window.setTimeout(obj._fnOnClick, iTimeout, "JavaScript");
var utterThis = new SpeechSynthesisUtterance(obj.innerText);
var synth = window.speechSynthesis;
synth.speak(utterThis);
console.log("work")
return is;
}
function goto(place) {
return location.href = place;
}
타임아웃을 걸어줘야한다.
var DELAY = 700, clicks = 0, timer = null;
$(function(){
$("a").on("click", function(e){
clicks++; //count clicks
if(clicks === 1) {
timer = setTimeout(function() {
alert("Single Click"); //perform single-click action
clicks = 0; //after action performed, reset counter
}, DELAY);
} else {
clearTimeout(timer); //prevent single-click action
alert("Double Click"); //perform double-click action
clicks = 0; //after action performed, reset counter
}
})
.on("dblclick", function(e){
e.preventDefault(); //cancel system double-click event
});
});
반응형
'구버전 팁' 카테고리의 다른 글
맥북 친해지기 (0) | 2020.11.22 |
---|---|
js 안되는 좌우 스크롤 억지로 먹여봅시다. (0) | 2020.11.17 |
input type="search" (0) | 2020.11.16 |
소나큐브( Sonarqube ) (0) | 2020.11.15 |
컨텐츠 도움 hover css 모음집 (0) | 2020.11.11 |