使用布尔值在切换时清除 val答案

【问题标题】：Clear val on toggle with boolean使用布尔值在切换时清除 val
【发布时间】：2011-04-15 23:35:54
【问题描述】：

我有一个隐藏的 div，其中包含表单元素，我在单选选项上切换（认为是/否作为选项）

如果他们选择是，则显示 div 并要求字段，否则隐藏 div 并清除字段（如果他们输入了任何值）。

除了通过将布尔标志传递给切换函数来清除值之外，我可以执行所有这些操作

例子：

$("[name=nameOfElement]").change(function() {
    var show = $('input[name=nameOfElement]:checked').val() == "true";
    $('#hiddenForm').toggle(show);
    $('#hiddenInput').toggleClass('required',show);
});

有什么东西可以清除传递的布尔选项的值吗？

$("[name=nameOfElement]").change(function() {
    var show = $('input[name=nameOfElement]:checked').val() == "true";
    $('#hiddenForm').toggle(show);
    $('#hiddenInput').toggleClass('required',show).valClear(show);
});

更新：不寻找插件只是想知道我是否可以在没有 if/else 条件的情况下做到这一点

【问题讨论】：

标签： jquery

【解决方案1】：

也许

$("[name=nameOfElement]").change(function() {
var show = $('input[name=nameOfElement]:checked').val() == "true";
$('#hiddenForm').toggle(show);
$('#hiddenInput').toggleClass('required',show).val(show ? $('#hiddenInput').val() : '');
});

【讨论】：

【解决方案2】：

您可以附加多个更改处理程序：

$("[name=nameOfElement]").change(function() {
    var show = $('input[name=nameOfElement]:checked').val() == "true";
    $('#hiddenForm').toggle(show);
    $('#hiddenInput').toggleClass('required',show);
});
$("[name=nameOfElement]").change(function() {
    if($('input[name=nameOfElement]:checked').val() == "true")
        $('#hiddenInput').val('');
});

但这看起来比只使用一个带有条件的处理程序更糟糕。您还可以创建自己的小插件来添加类似 valClear 的内容：

(function($) {
    $.fn.clearIf = function(clearIt) {
        if(clearIt)
            this.each(function() { $(this).val(''); });
        return this;
    };
})(jQuery);

然后：

$("[name=nameOfElement]").change(function() {
    var show = $('input[name=nameOfElement]:checked').val() == "true";
    $('#hiddenForm').toggle(show);
    $('#hiddenInput').toggleClass('required',show).clearIf(!show);
});

如果我只是在一个地方这样做，我会采用 Ron 的三元方法。

【讨论】：