Jquery nếu yếu tố thời gian đầu tiên của nó đã được nhấp

Question

Tôi cần kịch bản của tôi để làm điều gì đó về lần đầu tiên một yếu tố được nhấp và tiếp tục làm điều gì đó khác nhau trên nhấp chuột 2,3,4 và vân vân

$('selector').click(function() { 
//I would realy like this variable to be updated 
var click = 0; 
    if (click === 0) { 
     do this 
     var click = 1; 
    } else { 
     do this 
    } 
});//end click 

thực sự tôi nghĩ rằng nó nên dựa vào các biến nhưng tôi không thể nghĩ làm thế nào để cập nhật các biến từ đây trên bất kỳ trợ giúp sẽ là tuyệt vời.

Answer 1

Có xem xét phương pháp .data() jQuery. Hãy xem xét ví dụ của bạn:

$('selector').click(function() { 
    var $this = $(this), 
     clickNum = $this.data('clickNum'); 

    if (!clickNum) clickNum = 1; 

    alert(clickNum); 

    $this.data('clickNum', ++clickNum); 
}); 

Xem một ví dụ làm việc ở đây: http://jsfiddle.net/uaaft/

Answer 2

Sử dụng data để duy trì trạng thái của bạn với phần tử.

Trong handler nhấp chuột,

sử dụng

$ (này) .data ('NUMBER_OF_CLICKS')

để lấy giá trị và

$ (này) .data ('number_of_clicks', some_value)

để đặt.

Lưu ý: $ (this) .data ('NUMBER_OF_CLICKS') sẽ trả về false nếu nó chưa được cài đặt chưa

Chỉnh sửa: liên kết cố định

Answer 3

Nếu bạn chỉ cần trình tự các hành vi cố định, bạn có thể làm điều này:

$ ('chọn') chuyển đổi (chức năng.() {...}, hàm() {...}, hàm() {...}, ...);

Trình xử lý sự kiện trong phương thức chuyển đổi sẽ được gọi là có trật tự.

Answer 4

Một lựa chọn khác có thể là để có hai chức năng, và ràng buộc một cách sử dụng one chức năng trong $(document).ready() (hoặc bất cứ nơi nào bạn đang ràng buộc xử lý của bạn), và trong chức năng đó, ràng buộc chức năng thứ hai để được chạy cho tất cả nhấp chuột tiếp theo sử dụng bind hoặc click.

ví dụ:

function FirstTime(element) { 
    // do stuff the first time round here 
    $(element.target).click(AllOtherTimes); 
} 

function AllOtherTimes(element) { 
    // do stuff all subsequent times here 
} 

$(function() { 
    $('selector').one('click', FirstTime); 
}); 

Answer 5

$ ('# foo') một. (Nghe tiếng 'click', function() { alert ('này sẽ được hiển thị chỉ một lần.'); });

điều này sẽ ràng buộc sự kiện nhấp chuột vào phần tử Tương ứng Html một lần và hủy tự động nó sau lần hiển thị sự kiện đầu tiên.

Hoặc cách khác, bạn có thể làm như sau:

$ ("# foo").bind (nghe tiếng 'click', function() {

// Một số hoạt động

$ ("# foo") unbind ("click");.. // ràng buộc nó vào một số xử lý sự kiện khác

});

Answer 6

Đây là siêu dễ dàng trong vanilla Js. Đây là sử dụng hợp lý, xử lý nhấp chuột khác nhau

const onNextTimes = function(e) { 
    // Do this after all but first click 
}; 

node.addEventListener("click", function onFirstTime(e) { 
    node.addEventListener("click", onNextTimes); 
}, {once : true}); 

Documentation, CanIUse