通过复选框仅提交选择表单
我在表单验证中遇到此问题。
从图1中可以看到，用户可以选择。根据您的选择，更改表格。 （图片编号2和3）
我将其设为必填字段，并显示两个部分：无，直到用户单击两个按钮之一。
如何根据选择的内容仅激活一种形式？
如果我在完成第一个表单的字段时单击提交按钮，它会要求我提供第二个表单的字段，因为它们是必填字段。
非常感谢
显示按钮的jquery代码：
$( "#button-ritira" ).click(function() {
$( "#ricevi" ).hide( 1000 );
$( "#ritira" ).show( 400 );
});
$( "#button-ricevi" ).click(function() {
$( "#ritira" ).hide( 1000 );
$( "#ricevi" ).show( 400 );
});
HTML代码：
<div class="row mb-45">
<div class="col-lg-12">
<div class="row">
<div class="col-lg-4 offset-lg-2 text-center">
<label class="label-space-radio-ritira mb-25">
<input type="radio" name="ritira" id="button-ritira" autocomplete="off">
<span class="radiocustom-ritira"></span>
</label>
</div>
<div class="col-lg-4 text-center">
<label class="label-space-radio-ritira mb-25">
<input type="radio" name="ritira" id="button-ricevi" autocomplete="off">
<span class="radiocustom-ricevi"></span>
</label>
</div>
</div>
</div>
</div>
<div class="row" id="ritira">
<div class="col-lg-12">
<div class="row">
<div class="col-lg-4 offset-lg-2">
<div class="input-form-ricevi-ritira">
<label>Nome</label>
<input type="text" name="nome" placeholder="Nome" required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Cognome</label>
<input type="text" name="cognome" placeholder="Cognome" required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Email</label>
<input type="text" name="email" placeholder="Email" required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Cellulare</label>
<input type="text" name="cellulare" placeholder="Cellulare" required autocomplete="off">
</div>
</div>
<div class="col-lg-4">
<img src="img/assets/titolo-quando.svg" alt="titolo quando cremeria opera" class="titolo-quando">
<div class="row m-giorno-ora">
<div class="col-lg-6">
<div class="input-form-ricevi-ritira ">
<label>Giorno</label>
<input type="text" name="giorno" placeholder="gg/mm/aaaa" class="input-giorno" required autocomplete="off">
</div>
</div>
<div class="col-lg-4">
<div class="input-form-ricevi-ritira ">
<label>Ora</label>
<input type="text" name="ora" placeholder="00:00" class="input-ora" required autocomplete="off">
</div>
</div>
</div>
<img src="img/assets/titolo-dove.svg" alt="titolo dove cremeria opera" class="titolo-dove">
<label class="label-space-radiodove ">Sant'Anna
<span class="inner-light-title-check">Viale Gaetano Luporini, 951 - Lucca</span>
<input type="radio" name="ritiro" autocomplete="off">
<span class="radiodove"></span>
</label>
<label class="label-space-radiodove mb-25">Sant'Alessio
<span class="inner-light-title-check">Via di Sant'Alessio, 927 - Lucca</span>
<input type="radio" name="ritiro" autocomplete="off">
<span class="radiodove"></span>
</label>
</div>
</div>
</div>
</div>
<div class="row" id="ricevi">
<div class="col-lg-12">
<div class="row">
<div class="col-lg-4 offset-lg-2">
<div class="input-form-ricevi-ritira">
<label>Nome</label>
<input type="text" name="nome" placeholder="Nome" required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Cognome</label>
<input type="text" name="cognome" placeholder="Cognome" required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Email</label>
<input type="text" name="email" placeholder="Email" required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Cellulare</label>
<input type="text" name="cellulare" placeholder="Cellulare" required autocomplete="off">
</div>
</div>
<div class="col-lg-4">
<img src="img/assets/titolo-quando.svg" alt="titolo quando cremeria opera" class="titolo-quando">
<div class="row m-giorno-ora">
<div class="col-lg-6">
<div class="input-form-ricevi-ritira ">
<label>Giorno</label>
<input type="text" name="giorno" placeholder="gg/mm/aaaa" class="input-giorno" required autocomplete="off">
</div>
</div>
<div class="col-lg-4">
<div class="input-form-ricevi-ritira ">
<label>Ora</label>
<input type="text" name="ora" placeholder="00:00" class="input-ora" required autocomplete="off">
</div>
</div>
</div>
<img src="img/assets/titolo-dove.svg" alt="titolo dove cremeria opera" class="titolo-dove">
<div class="input-form-ricevi-ritira input-indirizzo">
<label>Indirizzo</label>
<input type="text" name="indirizzo" placeholder="Inserisci l'indirizzo completo" required>
</div>
</div>
</div>
</div>
</div>
1 个答案:
答案 0 :(得分：0)
除了隐藏和显示外，还可以在所有输入字段上禁用一个表单类。另一个残疾人。当显示和隐藏表单时，您还启用/禁用其他输入字段，因此不会被发布。
您可以在不隐藏禁用字段的情况下查看演示。
如果（我怀疑）他们仍然因要求而仍然要求将其归档，那么您也可以采用相同的方式删除/添加要求
$( "#button-ritira" ).click(function() {
//$( "#ricevi" ).hide( 1000 );
//$( "#ritira" ).show( 400 );
$(".disabled").prop('disabled', true);
$(".disabledtwo").prop('disabled', false);
});
$( "#button-ricevi" ).click(function() {
//$( "#ritira" ).hide( 1000 );
//$( "#ricevi" ).show( 400 );
$(".disabledtwo").prop('disabled', true);
$(".disabled").prop('disabled', false);
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row mb-45">
<div class="col-lg-12">
<div class="row">
<div class="col-lg-4 offset-lg-2 text-center">
<label class="label-space-radio-ritira mb-25">
<input type="radio" name="ritira" id="button-ritira" autocomplete="off">
<span class="radiocustom-ritira"></span>
</label>
</div>
<div class="col-lg-4 text-center">
<label class="label-space-radio-ritira mb-25">
<input type="radio" name="ritira" id="button-ricevi" autocomplete="off">
<span class="radiocustom-ricevi"></span>
</label>
</div>
</div>
</div>
</div>
<div class="row" id="ritira">
<div class="col-lg-12">
<div class="row">
<div class="col-lg-4 offset-lg-2">
<div class="input-form-ricevi-ritira">
<label>Nome</label>
<input type="text" name="nome" class="disabled" placeholder="Nome" required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Cognome</label>
<input type="text" name="cognome" class="disabled"placeholder="Cognome" required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Email</label>
<input type="text" name="email" class="disabled"placeholder="Email" required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Cellulare</label>
<input type="text" name="cellulare" class="disabled" placeholder="Cellulare" required autocomplete="off">
</div>
</div>
<div class="col-lg-4">
<img src="img/assets/titolo-quando.svg" alt="titolo quando cremeria opera" class="titolo-quando">
<div class="row m-giorno-ora">
<div class="col-lg-6">
<div class="input-form-ricevi-ritira ">
<label>Giorno</label>
<input type="text" name="giorno" class="disabled" placeholder="gg/mm/aaaa" class="input-giorno" required autocomplete="off">
</div>
</div>
<div class="col-lg-4">
<div class="input-form-ricevi-ritira ">
<label>Ora</label>
<input type="text" name="ora" class="disabled" placeholder="00:00" class="input-ora" required autocomplete="off">
</div>
</div>
</div>
<img src="img/assets/titolo-dove.svg" alt="titolo dove cremeria opera" class="titolo-dove">
<label class="label-space-radiodove ">Sant'Anna
<span class="inner-light-title-check">Viale Gaetano Luporini, 951 - Lucca</span>
<input type="radio" name="ritiro" class="disabled" autocomplete="off">
<span class="radiodove"></span>
</label>
<label class="label-space-radiodove mb-25">Sant'Alessio
<span class="inner-light-title-check">Via di Sant'Alessio, 927 - Lucca</span>
<input type="radio" name="ritiro" class="disabled" autocomplete="off">
<span class="radiodove"></span>
</label>
</div>
</div>
</div>
</div>
<div class="row" id="ricevi">
<div class="col-lg-12">
<div class="row">
<div class="col-lg-4 offset-lg-2">
<div class="input-form-ricevi-ritira">
<label>Nome</label>
<input type="text" name="nome" placeholder="Nome" class="disabledtwo" required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Cognome</label>
<input type="text" name="cognome" placeholder="Cognome" class="disabledtwo" required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Email</label>
<input type="text" name="email" placeholder="Email" class="disabledtwo"required autocomplete="off">
</div>
<div class="input-form-ricevi-ritira">
<label>Cellulare</label>
<input type="text" name="cellulare" placeholder="Cellulare" class="disabledtwo"required autocomplete="off">
</div>
</div>
<div class="col-lg-4">
<img src="img/assets/titolo-quando.svg" alt="titolo quando cremeria opera" class="titolo-quando">
<div class="row m-giorno-ora">
<div class="col-lg-6">
<div class="input-form-ricevi-ritira ">
<label>Giorno</label>
<input type="text" name="giorno" placeholder="gg/mm/aaaa" class="disabledtwo"class="input-giorno" required autocomplete="off">
</div>
</div>
<div class="col-lg-4">
<div class="input-form-ricevi-ritira ">
<label>Ora</label>
<input type="text" name="ora" placeholder="00:00" class="disabledtwo" class="input-ora" required autocomplete="off">
</div>
</div>
</div>
<img src="img/assets/titolo-dove.svg" alt="titolo dove cremeria opera" class="titolo-dove">
<div class="input-form-ricevi-ritira input-indirizzo">
<label>Indirizzo</label>
<input type="text" name="indirizzo" placeholder="Inserisci l'indirizzo completo" class="disabledtwo" required>
</div>
</div>
</div>
</div>
</div>
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？