2015-07-21 19 views
12

Tôi có dưới đây JQuery eventhandler. Tôi muốn dừng tất cả các điều hướng trên một trang web.Dừng tuyên truyền không hoạt động

$(document).click(function(event) { 
      event.stopPropagation(); 
      event.preventDefault(); 
      event.cancelBubble = true; 
      event.stopImmediatePropagation(); 
      $(document).css('border-color',''); 
      $(document).css('background-color',''); 
      $(event.target).css('border-color','yellow'); 
      $(event.target).css('background-color','#6BFF70'); 
      return false; 
    }); 

Khi tôi sử dụng tính năng này trên trang Đăng nhập Facebook, nó sẽ dừng tất cả điều hướng. Nhưng trong trang chủ của Google, nút "Tôi cảm thấy may mắn" vẫn điều hướng đến trang tiếp theo. Làm thế nào để tránh nó?

Tôi đang sử dụng trình duyệt JavaFX bằng cách này. Nó tương tự như trình duyệt Safari.

+0

Tôi đã thử sử dụng $ ('*'). Vẫn còn hành vi tương tự. – NaveenBharadwaj

+0

Nếu bạn chỉ muốn ngăn chặn bất kỳ đầu vào của người dùng, tôi sẽ thêm một div bao gồm tất cả các cơ thể – Hacketo

+0

@ Hacketo, tôi phải làm điều này trên bất kỳ trang web mà tôi tải trong trình duyệt. Tôi không có một HTML của riêng tôi. – NaveenBharadwaj

Trả lời

14

Nếu tôi tải các trang tìm kiếm của Google, và thực hiện điều này tại giao diện điều khiển:

document.body.addEventListener(
    "click", 
    function (ev) { ev.stopPropagation(); ev.preventDefault(); }, 
    true); 

sau đó tôi không thể nhấp vào nút "Tôi cảm thấy may mắn" nữa. Điều quan trọng là sử dụng thông số thứ ba và đặt nó thành true.Đây là những gì MDN [nói] về nó:

useCapture Tùy chọn

Nếu đúng, useCapture chỉ ra rằng người dùng muốn để bắt đầu chụp. Sau khi bắt đầu chụp, tất cả các sự kiện của loại được chỉ định sẽ được gửi đến người nghe đã đăng ký trước khi được gửi đến bất kỳ EventTarget nào bên dưới nó trong cây DOM.

(Nhấn mạnh thêm.)

gì bạn đã cố gắng để làm không hiệu quả vì xử lý sự kiện của bạn nằm trên document, và do đó sẽ được gọi sau bất cứ xử lý sự kiện trên trẻ em của tài liệu. Vì vậy, xử lý của bạn không thể ngăn chặn bất cứ điều gì.

Với useCapture đặt thành true, bạn có thể hoạt động trên sự kiện trước khi có cơ hội được chuyển đến phần tử con. Tôi không biết một cách để xử lý sự kiện của jQuery làm việc theo cách bạn nhận được với useCapture. Barmar's answer here nói rằng bạn không thể sử dụng jQuery để đặt trình xử lý như vậy. Tôi có khuynh hướng tin anh ta.

+0

Cảm ơn vì điều đó .. Điều này phù hợp với tôi – NaveenBharadwaj

+0

Chắc chắn javascript vani tốt nhất cho nhấp chuột trong phần tử bên trong của div cha, mà không cần bấm vào div cha. Nó hoạt động hoàn hảo! Cảm ơn – Rafa

0

Hãy thử điều này:

$('body').click(function(event) { 
      event.stopPropagation(); 
      event.preventDefault(); 
      event.cancelBubble = true; 
      event.stopImmediatePropagation(); 
      $(document).css('border-color',''); 
      $(document).css('background-color',''); 
      $(event.target).css('border-color','yellow'); 
      $(event.target).css('background-color','#6BFF70'); 
      return false; 
    }); 
+0

Nút "Tôi đang cảm thấy may mắn" đang điều hướng. – NaveenBharadwaj

0

Cố gắng để ràng buộc không chỉ để click sự kiện, nhưng cũng trên mousedown sự kiện.

+0

Không hoạt động. Nút "Tôi cảm thấy may mắn" của Google vẫn đang điều hướng – NaveenBharadwaj

0

Hãy thử css này:

body * { 
    pointer-events: none; 
} 

hoặc trong jQuery:

$("body *").css("pointer-events", "none"); 
0

Hãy thử tuyên bố một sự kiện cửa sổ mới và sau đó dừng việc tuyên truyền từ đó:

var e = window.event; 
e.cancelBubble = true; 
if (e.stopPropagation) 
{ 
    e.stopPropagation(); 
} 
0

Lưu ý rằng Google sử dụng jsaction="..." thay vì onclick = "...". Hãy thử sử dụng phương pháp unbind trên nút được chỉ định.

Ngoài ra bạn có thể sử dụng tập tin đính kèm động, như:

$(document).on('click', '*', function 

Hoặc throw new Error() (cũng giống như một bẩn hack)

5

99,99% của các trang web sẽ không thể đã chuyển hướng của họ dừng lại bằng cách ngăn chặn sự kiện tuyên truyền vì lý do tôi đã nhận xét (bạn không thể dừng sự kiện trước khi nó kích hoạt tất cả trình xử lý cho mục tiêu ban đầu của sự kiện). Nếu ngăn điều hướng là tất cả những gì bạn quan tâm, tôi khuyên bạn nên sử dụng sự kiện window.onbeforeunload, được tạo cho tình huống chính xác này.

Dưới đây là một ví dụ: http://jsfiddle.net/ejreseuu/

HTML:

<a href="google.com">google</a> 

JS:

window.onbeforeunload = function() { 
    return "Are you sure?" 
} 

Không có cách nào để không có một hộp thoại xác nhận mà tôi biết, như mã khóa người dùng ra khỏi điều hướng đi bất kể họ làm gì thường là độc hại.

0

ngăn chặnDefault() không hoạt động trong trường hợp này, khiến Google dựa vào tùy chỉnh trình xử lý sự kiện để xử lý các sự kiện nhấp trên nút này. Khi preventDefault() ngăn chặn hành vi mặc định của trình duyệt.

Ví dụ: nếu nút này thuộc loại = "gửi", ngăn chặn mặc định trên sự kiện nhấp chuột sẽ ngăn chặn hành vi mặc định của trình duyệt đang gửi biểu mẫu. Nhưng trong trường hợp này, bấm được xử lý bởi eventListeners được thêm vào chính nút đó. preventDefault() sẽ không ảnh hưởng đến việc bắt một sự kiện của chúng. Cũng stopPropagation(), bởi vì nó dừng truyền bá sự kiện đến các mức cao hơn của DOM, trong khi các eventListeners khác trên cùng một mức (nút trong trường hợp của chúng ta) vẫn nhận được sự kiện. stopImmediatePropagation() có thể hoạt động theo lý thuyết, nhưng chỉ khi eventListener của bạn được thêm trước khi google. Vì vậy, cách dễ nhất để ngừng tuyên truyền là dừng một sự kiện trước khi nó đạt đến nút nút, và đó là trong giai đoạn chụp, vì nút là phần tử thấp nhất trong cấu trúc phân cấp. Điều này có thể được thực hiện bằng cách thông qua đúng tranh cãi khi thêm eventListener

document.body.addEventListener("click", function (event) { 
    event.stopPropagation(); 
}, true); 

Bằng cách này sự kiện sẽ được dừng lại trước khi giai đoạn bong bóng, và vì vậy trước khi nó đạt đến eventListeners bổ sung vào nút. Thông tin thêm về các giai đoạn chụp và bong bóng here

Lưu ý rằng ngăn chặnDefault() không cần thiết trong trường hợp này. Trên thực tế, trình xử lý sự kiện của nút này là để ngăn chặn mặc định.Dưới đây là những eventListeners, cho nhấp chuột và KeyUp tương ứng: gọi

d = function(a) { 
c.Xa.search(c.yc(), b); 
return s_1vb(a) 
} 

function(a) { 
13 != a.keyCode && 32 != a.keyCode || d(a) 
} 

lưu ý để s_1vb, đây là sourse của nó:

s_1vb.toString(); 
/*"function (a){ 
    a&&(a.preventDefault&&a.preventDefault(),a.returnValue=!1); 
    return!1 
    }"*/ 

Về cơ bản một chức năng của nó mà phải mất một sự kiện và làm mọi thứ có thể để ngăn chặn trình duyệt hành vi mặc định

Nhân tiện, hành vi mặc định có thể bị hủy trên bất kỳ giai đoạn nào của luồng sự kiện (se Events Specification), bao gồm cả giai đoạn cuối cùng, khi nó đạt đến tài liệu. Chỉ sau khi nó được thông qua "thông qua" tất cả các eventListeners uncanceled, trình duyệt nên thực hiện hành vi mặc định của nó. Vì vậy, việc gắn trình lắng nghe của bạn vào tài liệu không phải là lý do ngăn chặnDefault() không hoạt động, đó là bởi vì đó là do nhầm lẫn với công việc :)

Các vấn đề liên quan