[英]How to make an element mouse unclickable but clickable through javascript?
我在jQuery中使用翻轉插件來翻轉給定的 div。
代碼(重復使用某人的代碼),在您單擊后翻轉一個元素。
我有幾張圖片,通過使用此功能,我試圖創建一個 animation。我正在使用jQuery單擊這些圖片。 然而,問題是即使用戶可以單擊圖像並再次翻轉我不想要的圖像。
我嘗試使用CSS屬性:
body{pointer-events:none;}
這有效,但在完成animation 后,我無法使用 jQuery禁用它。我試過:
$('body').css('pointer-events','normal');
我正在重用的代碼是:
$(document).ready(function() { /* The following code is executed once the DOM is loaded */
$('.sponsorFlip').bind("click", function() {
// $(this) point to the clicked .sponsorFlip element (caching it in elem for speed):
var elem = $(this);
// data('flipped') is a flag we set when we flip the element:
if (elem.data('flipped')) {
// If the element has already been flipped, use the revertFlip method
// defined by the plug-in to revert to the default state automatically:
elem.revertFlip();
// Unsetting the flag:
elem.data('flipped', false)
}
else {
// Using the flip method defined by the plugin:
$(this).unbind("click");
$(this).unbind("click");
$(this).unbind("click");
elem.flip({
direction: 'lr',
speed: 350,
onBefore: function() {
// Insert the contents of the .sponsorData div (hidden from view with display:none)
// into the clicked .sponsorFlip div before the flipping animation starts:
elem.html(elem.siblings('.sponsorData').html());
}
});
// Setting the flag:
elem.data('flipped', true);
}
});
});
我嘗試通過添加
$('.sponsorFlip').unbind("click");
它也不起作用。
$('.sponsorFlip').on('click', function(e) {
// for a click event by mouse has e.clienX/e.clientY
if(e.clientX){
// then click by mouse
} else {
// triggered
}
});
為你的代碼
$('.sponsorFlip').bind('click', function(e) {
// for a click event by mouse has e.clienX/e.clientY
if(e.clientX){
// then click by mouse
} else {
// triggered
}
});
將其分配給點擊事件,然后模擬點擊,然后取消分配點擊事件似乎有點 hack。 為什么不創建一個直接翻轉元素的 function 呢?
var options = {...};
$(element).flip(options);
要獲得快速解決方案,只需嘗試刪除這些行:
// If the element has already been flipped, use the revertFlip method
// defined by the plug-in to revert to the default state automatically:
elem.revertFlip();
// Unsetting the flag:
elem.data('flipped', false)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.