Question

我有一个带有表单元素的隐藏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条件的情况下执行此操作

Answer 1

也许

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

Answer 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);
});

如果我只是在一个地方做这件事，我会选择罗恩的三元方法。

使用布尔值清除切换时的val

2 个答案: