Dừng sự kiện kéo trong khi nhấp vào liên kết

Question

tôi có sự kiện kéo trên div.image được đính kèm.

khi tôi di chuột xuống trên div sự kiện kéo bắt đầu.cho điều này tôi bao gồm plugin nestable.js.i muốn dừng sự kiện kéo div khi nhấp vào liên kết div .i đang sử dụng tệp js và html từ liên kết : Nestable

Vui lòng cung cấp giải pháp, làm cách nào tôi có thể thực hiện.

Answer 1

Bạn cần phải ngăn chặn sự lan truyền của sự kiện nhấp chuột từ các yếu tố liên kết

Ex:

$('#div').on('click', 'a', function(){ 
    return false; 
}) 

Answer 2

tác giả có một vấn đề với plugin nestable. có một số cách tốt hơn để giải quyết vấn đề của liên kết nhấp chuột được đặt trong container nestable:

$(".dd a").on("mousedown", function(event) { // mousedown prevent nestable click 
    event.preventDefault(); 
    return false; 
}); 

$(".dd a").on("click", function(event) { // click event 
    event.preventDefault(); 
    window.location = $(this).attr("href"); 
    return false; 
}); 

.dd - lớp container nestable mặc định, thay đổi nó nếu bạn cần

Answer 3

Để bỏ qua xử lý trên nhấp chuột, thêm "dd-nodrag" class vào phần tử.

Answer 4

Bạn có thể tắt tính năng này bằng cách sử dụng lớp CSS tùy chỉnh.

.disableDrag{ 
    display: block; 
    margin: 5px 0; 
    padding: 6px 10px 8px 40px; 
    font-size: 15px; 
    color: #333333; 
    text-decoration: none; 
    border: 1px solid #cfcfcf; 
    background: #fbfbfb; 
} 

Sử dụng lớp CSS được tạo trên mục bạn muốn tắt.

dụJSFiddle

<li class="dd-item"> <div class="disableDrag"><em class="badge pull-right"></em></div> </li> 

Answer 5

<div class="dd-handle"> 
ID - Title <a href="#" class="dd-nodrag link_min">Link</a> 

.link_min{ 
    position: absolute; 
    display: inline-block; 
    right: 0px; 
    margin-right: 8px; 
}