các nút không có href, onclick vv

Question

Gần đây, tôi đã nhìn thấy rất nhiều trang web có các đối tượng có thể nhấp không có bất kỳ href hoặc onclicks nào trong mã html của chúng. Tôi cũng đã cố gắng cảnh báo về href của họ, onclick, onmousedown, onmouseup thuộc tính nhưng nó chỉ nói "không xác định". Tôi nhận thấy rằng có rất nhiều javascript phức tạp trong các trang này.

một trang web đặc biệt là vách ngăn tôi: http://www.sharenator.com/Boy_Teaches_His_Puppy_How_to_Eat/#/doggy_01_Boy_Teaches_His_Puppy_How_to_Eat-0.html

Nó thực sự khá tốt. Các nút cũng không thể chọn được. Các id của các nút là nextBtn, nextBtn2, prevBtn và prevBtn2.

Bất kỳ ai có ý tưởng nào về cách triển khai tính năng này?

Answer 1

Bạn có thể sử dụng hàm .click (gọi lại) của jQuery (http://api.jquery.com/click/) hoặc .delegate (selector, 'click', callback) (trước jQuery 1.7) và .on ('click', selector, callback) (jQuery 1.7 +) hoặc .bind ('click', gọi lại).

Nhờ Anthony Grist đã chỉ ra rằng .live() bây giờ bị phản đối :)

Như vậy:

<button id="clickable">Click Me!!</button> 

Sau đó nhắm mục tiêu vào nút với jQuery:

$("#clickable").click(function(){ 
    // Send user to this link 
    location.href = "http://www.takemehere.com"; 
}); 

Bạn có thể đọc thêm về điều này trên liên kết tôi đã cung cấp và trên trang chủ của jQuery.

CẬP NHẬT

Các trang thực tế xử lý này với:

$('#prevBtn').mousedown (onBackward); 

Trong đó sẽ onmousedown gọi:

function onBackward() { 
    showImg (currentId - 1); 
} 

Việc sử dụng các phím mũi tên:

$(document).keyup (function (event) { 
    var activeElement = document.activeElement.tagName; 
    if (activeElement == 'INPUT' || activeElement == 'TEXTAREA') return; 
    //alert (window.location.pathname); 

    if (event.keyCode == 39) onForward(); 
    else 
    if (event.keyCode == 37) onBackward(); 
}); 

Xem http://www.sharenator.com/js/slideshow.js để biết mã nguồn của trình chiếu.

Answer 2

Với javascript, tìm phần tử và cung cấp cho nó một trình xử lý sự kiện onClick. ví dụ:

var myElement = document.body; // or document.getElementById(...), etc. 
myElement.onclick = function(event) {alert(event);} 

Điều này sẽ tránh hiển thị bất kỳ thứ gì trong HTML và không có cách nào khác để xác định hành vi ... ngoại trừ có thể là bí truyền CSS).

Answer 3

Bạn có thể thử sử dụng thư viện jQuery ui - điều này có thể tạo các nút theo cách bạn chỉ định.

jQuery UI

Answer 4

Các xử lý sự kiện có lẽ ràng buộc sử dụng một khuôn khổ javascript như jQuery. Chúng không sử dụng thuộc tính onclick của phần tử DOM. Xem this jsFiddle để biết ví dụ về ràng buộc trình xử lý sự kiện click với nút có jQuery, sau đó nhấp vào nút để xem giá trị onclick cho nút đó (hiển thị là null trong FF 9).

Answer 5

Với javascript.Dưới đây là ví dụ:

<a id="uniqueId" href="#">Button</a> 

<script> 
    var button = document.getElementById('uniqueId'); 
    button.onclick = function(e) { 
     alert("clicked!"); 
    } 
</script> 

Answer 6

chức năng nhấp chuột có thể được khởi tạo bằng j, ví dụ: $ ("# nextBtn"). Nhấp (hàm);