Javascript 如何使下降div可点击?
我在falling div中制作了文字,我的代码示例如下: 但我不明白为什么我不能让div的文字可以点击。有时我可以单击它,然后用word查看警报消息,但有时我应该单击上面的word以查看警报消息。也许是因为这种动画方式很慢吧 我的代码的主要部分:Javascript 如何使下降div可点击?,javascript,Javascript,我在falling div中制作了文字,我的代码示例如下: 但我不明白为什么我不能让div的文字可以点击。有时我可以单击它,然后用word查看警报消息,但有时我应该单击上面的word以查看警报消息。也许是因为这种动画方式很慢吧 我的代码的主要部分: /* Start by creating a wrapper div, and an empty img element */ var leafDiv = document.createElement('div'); var image = doc
/* Start by creating a wrapper div, and an empty img element */
var leafDiv = document.createElement('div');
var image = document.createElement('div');
/* Randomly choose a leaf image and assign it to the newly created element */
image.innerHTML = phrase[counter];
image.style.padding = "40px 0 0 20px";
leafDiv.style.backgroundColor = "#eee";
leafDiv.setAttribute('data-url', counter);
leafDiv.setAttribute('data-text', phrase[counter]);
leafDiv.onclick = function () {
alert($(this).attr('data-text'));
};
leafDiv.style.top = "-100px";
我编辑了你的小提琴并在这里解决了它: 绑定动画dom元素上的
click
事件有点棘手,如您所见,很难“捕获”它们
在这些情况下,最好绑定mousedown
或mouseup
。在这种情况下,我认为首选mouseup
看看这是不是你的意思
希望有帮助
/*
// YOUR OLD METHOD
leafDiv.onclick = function () {
alert($(this).attr('data-text'));
};
*/
// MY SUGGESTION
leafDiv.addEventListener('mouseup', function() {
alert($(this).attr('data-text'));
});