jQuery要求雙擊並懸停事件

Question

當前在我的訂單頁面上，我有“訂單狀態：待處理”。 如果需要更改訂單狀態，我想雙擊文本，然后出現一個下拉菜單。

因此，我要隱藏下拉菜單，然后雙擊顯示下拉菜單並隱藏文本。

我的問題是，如果用戶不從下拉菜單中選擇新項目，我希望它返回文本...因此，我認為您必須雙擊並懸停該元素才能正常工作。

我這樣做只是為了測試：

    $(".offerStatus").bind('click', function() {
    $(".offerStatus").hover(function(){
        $(".offerStatus").html("YES");
    }, function(){
        $(".offerStatus").html("NO");
    });
});

它可以工作，但是僅在您單擊並從元素懸停然后再懸停時才顯示。 因此，如果我單擊.offerStatus並且由於將鼠標懸停在它上面，我應該看到“是”，但我沒有看到。 然后，當我將光標從該元素上移開時，應該會看到它轉到“ NO”，它可以正常工作。 我要弄清楚的唯一一件事是，一旦用戶單擊或類似的東西，就讓該元素返回。

謝謝

Answer 1

可以在元素中使用保持懸停狀態

$(".offerStatus").hover(function(){
    $(".offerStatus").data('isHover', true);
}, function(){
    $(".offerStatus").data('isHover', false);
});

$(".offerStatus").click(function() {
    var status = 'NO';
    if($(this).data('isHover')) {
        status = 'YES';
    }
    $(this).html(status);
});