有沒有像jQuery.toggle（布爾）存在？

我寫了很多類似於以下代碼的東西。它基本上根據某些條件來切換元素。有沒有像jQuery.toggle（布爾）存在？

在下面的組裝示例中，條件是「如果agree複選框被選中並且name字段不爲空」。

$("button").click(function() { 
    if ($("#agree").is(":checked") && $("#name").val() != "") { 
    $("#mydiv").show(); 
    } else { 
    $("#mydiv").hide(); 
    } 
});

我希望有某種類似的jQuery函數可以這樣工作。

$("button").click(function() { 
    var condition = $("#agree").is(":checked") && $("#name").val() != ""); 
    $("#mydiv").toggle(condition); 
});

有沒有像這樣的東西呢？或者除了第一個例子之外，還有其他方法可以以更少的方式實現此目的嗎？

來源

2010-03-05 jessegavin

好了，我是一個白癡並且在我提問之前需要RTM。

jQuery.toggle()允許您開箱即用。

$("button").click(function() { 
    var condition = $("#agree").is(":checked") && $("#name").val() != ""); 
    $("#mydiv").toggle(condition); 
});

來源

2010-03-05 18:03:05 jessegavin

你知道這個函數的一個版本支持轉換的緩動/淡入/滑動嗎？這種特殊的方法似乎並不如此，並且它讓我的頁面跳躍很快，對用戶來說比一張溫和的幻燈片更令人困惑。 –

是的，它被添加到jQuery版本1.4.3。查看文檔頁面（http://api.jquery.com/toggle/#toggle2），您會看到有三種方法可以調用toggle（），以便使用以下內容：.toggle（[duration]，[ [回調]） – jessegavin

AFAIK你不能傳遞一個布爾值和一個持續時間/緩動等等，但是我希望立場糾正。 – Galaxy

你可以自己寫這個函數。

function toggleIf(element, condition) { 
    if (condition) { element.show(); } 
    else { element.hide(); } 
}

然後使用它是這樣的：

toggleIf($("button"), $("#agree").is(":checked") && $("#name").val() != "");

來源

2010-03-05 17:33:40

首先，讓我們看看，如果我理解你想要正確地做什麼...... 你想看看一個複選框的狀態（或檢查不），並根據該值的狀態隱藏或顯示第二個div。

定義這種風格：

.noDisplay { 
    display:none; 
}

使用這個JavaScript：

$("button").click(function() { 
    $("#mydiv").toggleClass("noDisplay", $("#name").val() == ""); 
});

從jQuery的它的文檔可以在這裏找到： http://api.jquery.com/toggleClass/

來源

2010-03-05 17:38:47

-1

如果toggle()是對你不好（例如，因爲它動畫），你可以寫一個小的jQuery插件，像這樣：

$.fn.toggleIf = function(showOrHide) { 
    return this.each(function() { 
    if (showOrHide) { 
     return $(this).show(); 
    } else { 
     return $(this).hide(); 
    } 
    }); 
};

，然後用它是這樣的：

$(element).toggleIf(condition);

來源

2013-04-28 16:54:12

''.toggle（）'函數只在傳遞持續時間值作爲參數時纔會動畫。如果你傳遞一個布爾參數，它會*不*動畫。所以像這樣的插件將是多餘的。看到這裏：http://jsfiddle.net/qvdsu/ – jessegavin

有沒有像jQuery.toggle（布爾）存在？

回答

相關問題