Javascript jQuery:设置/重置具有特定类的表单字段(改进代码)

Javascript jQuery:设置/重置具有特定类的表单字段(改进代码),javascript,jquery,html,find,show-hide,Javascript,Jquery,Html,Find,Show Hide,我是jQuery新手,希望这里有人能帮我解决这个问题 我有一个带有隐藏div的大型HTML表单(“#requestDetails”)。 在此div中,有复选框、单选按钮和特定值('.hiddenDefault')上的特定类的选择,这些值仅用于在可见时应用默认值 现在我有一个事件显示这个div,另一个事件再次隐藏它 显示div时我想设置上述默认值。 隐藏时我想重置字段,包括该div中的所有输入字段(即取消选中/取消选中它们并删除任何默认值或输入值) 我有下面的代码,乍一看似乎还可以,但我想知道这是

我是jQuery新手,希望这里有人能帮我解决这个问题

我有一个带有隐藏div的大型HTML表单(
“#requestDetails”
)。 在此div中,有复选框、单选按钮和特定值(
'.hiddenDefault'
)上的特定类的选择,这些值仅用于在可见时应用默认值

现在我有一个事件显示这个div,另一个事件再次隐藏它

显示div时我想设置上述默认值。
隐藏时我想重置字段,包括该div中的所有输入字段(即取消选中/取消选中它们并删除任何默认值或输入值)

我有下面的代码,乍一看似乎还可以,但我想知道这是否是正确/有效的代码,我是否遗漏了任何东西,以及是否有更好/更快的方法来实现相同的目标

我的jQuery:

$('[name=requestType]').on('change', function(){
    if($(this).hasClass('triggerDiv')){
        $('#requestDetails').find('.hiddenDefault').each(function(){
            // set default values + show div
            $(this).not('select').prop('checked', true);
            $(this).not('input[type=checkbox], input[type=radio]').prop('selected', true);
        });
        $('#requestDetails').show();
    }else{
        $('#requestDetails').find('input, select').each(function(){
            // empty / reset fields + hide div
            $(this).find('input[type=checkbox], input[type=radio]').prop('checked', false);
            $(this).find('input').not(':button, :checkbox, :hidden, :radio, :reset, :submit').val('');
            $(this).find('select').prop('selected', false);                     
        });
        $('#requestDetails').hide();
    }
});
非常感谢您在此方面的帮助,
Mike

只是改进了您编写的代码的语法或风格:

$('[name=requestType]').on('change', function(){
    if($(this).hasClass('triggerDiv')){
        // show div + set default values
            $(this).not('select').prop('checked', true);
        $(this).not('input[type=checkbox], input[type=radio]').prop('selected', true);
            $('#requestDetails').show();
    }else{
        // hide div + reset fields
             $('#requestDetails').find('input[type=checkbox], input[type=radio], input, select').not(':button, :checkbox, :hidden, :radio, :reset, :submit').val('').prop('checked', false);             
             $('#requestDetails').hide();
    }
});
对不起,我没有检查语法,如果我在语法上有错误,请纠正我。
这不会像您在每个文件中写的那样提高性能。

尝试更改.prop('checked',true);to.attr('checked',true)@卢卡·德纳迪:谢谢,不是吗。支持更新的功能吗?它们看起来非常相似,我会进一步调查。同时,试着检查一下它们之间的区别:谢谢,卢卡我在这里的想法是,如果有一种方法可以以某种方式将我在单独的行中拥有的内容组合起来,就像我在代码中所想的那样,我在隐藏所有字段时循环了3次(每个字段对应一个.find)。要一次设置所有字段,还可以使用$('#requestDetails input[type=“checkbox”]').attr('checked',true'))@简单的男人:非常感谢-这正是我想要的!你能更新它以显示我刚才添加的.not函数吗?我会接受的,因为这是我所需要的一切。:)@Emm:谢谢-看起来这并不是指我需要的特定div和类(因为这个表单上还有其他隐藏的div和字段)。这会给你带来任何错误吗?我的意思是申请不会做和我做的一样的事情。@SimpleMan:谢谢-实际上我不得不更改它,因为我原来的节目代码没有正确工作,所以我认为修改答案也是有意义的。:)另外,关于隐藏部分,我是否理解您将复选框和收音机的值也设置为“”是否正确?这是故意的吗?根据您的要求更新