我正在尝试修改这段js代码,以便在您单击按钮后禁用.click事件。我是一个js的初学者,实际上只有一个基本的理解。我曾尝试使用if语句,但这不起作用。
下面是js代码:
var sec = ["30% ENTER KEYCODE: Thirty", "25% ENTER KEYCODE: Twenty-five", "20% ENTER KEYCODE: Twenty","15% ENTER KEYCOVE: Fifteen","10% ENTER KEYCODE: Ten","5% EMTER KEYCODE: Five"];
var offset = 30;
//set default degree (360*5)
var degree = 1800;
//number of clicks = 0
var clicks = 0;
$(document).ready(function(){
/*WHEEL SPIN FUNCTION*/
$('#spin').click(function(){
//add 1 every click
clicks ++;
/*multiply the degree by number of clicks
generate random number between 1 - 360,
then add to the new degree*/
var newDegree = degree*clicks;
var extraDegree = Math.floor(Math.random() * 360) + 1;
totalDegree = newDegree+extraDegree;
var colorIndex = Math.ceil(((totalDegree+30) % 360) / 60) -1;
var colorPrev = colorIndex == 0 ? 5 : colorIndex - 1;
var colorNext = colorIndex == 5 ? 0 : colorIndex + 1;
offset = (extraDegree % 60);
var result = sec[colorIndex];
if(offset == 0) {
result ;
} else if (offset <= 30) {
result ;
} else {
result ;
}
$("#answer").html("Answer: " + result);
/*let's make the spin btn to tilt every
time the edge of the section hits
the indicator*/
$('#wheel .sec').each(function(){
var t = $(this);
var noY = 0;
var c = 0;
var n = 700;
var interval = setInterval(function () {
c++;
if (c === n) {
clearInterval(interval);
}
var aoY = t.offset().top;
console.log(aoY);
/*23.7 is the minumum offset number that
each section can get, in a 30 angle degree.
So, if the offset reaches 23.7, then we know
that it has a 30 degree angle and therefore,
exactly aligned with the spin btn*/
if(aoY < 23.89){
console.log('<<<<<<<<');
$('#spin').addClass('spin');
setTimeout(function () {
$('#spin').removeClass('spin');
}, 100);
}
}, 10);
$('#inner-wheel').css({
'transform' : 'rotate(' + totalDegree + 'deg)'
});
noY = t.offset().top;
});
});
});//DOCUMENT READY这是我尝试改编https://codepen.io/anon/pen/JGwQva的原始帖子
我再次尝试禁用在您单击旋转按钮后旋转滚轮的功能。
发布于 2017-07-22 05:52:25
如果只想使用一次,有一个one()方法可以在第一次单击后删除监听器
更改:
$('#spin').click(function(){至
$('#spin').one('click',function(){发布于 2017-07-22 06:41:10
其他版主给出了几个提示。无论如何,你可以尝试其中的任何一个,如果这有帮助的话让我们来看看。
使用disabled属性的简单解决方案非常方便。
$(function() {
$('#spin').click(function() {
console.log('clicked..', this);
$(this).prop('disabled', true);
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="spin">Spin</button>
使用$.one的解决方案。
$(function() {
$('#spin').one('click', function() {
console.log('clicked..', this);
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="spin">Spin</button>
使用$.on和$.off的解决方案。
$(function() {
$('#spin').on('click', function() {
console.log('clicked..', this);
$(this).off('click');
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="spin">Spin</button>
使用一些类名的解决方案。
$(function() {
$('#spin').click(function() {
if ($(this).hasClass('hold')) {
return;
}
$(this).addClass('hold');
console.log('clicked..', this);
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="spin">Spin</button>
发布于 2017-07-22 05:55:49
$('#spin').click(function(){
clicks ++;
if (clicks < 1 ) {
//rest of You code and/or reset clicks variable
}
}另外,将click更改为$('#spin').on('click',function(){}
https://stackoverflow.com/questions/45247157
复制相似问题