邮寄复选框切换

最新推荐文章于 2023-05-08 14:38:04 发布

原创最新推荐文章于 2023-05-08 14:38:04 发布 · 132 阅读

0 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

83 篇文章

订阅专栏

本文介绍了一个基于jQuery的送达方式选择功能实现，当用户选择自取时，邮寄相关表单字段被隐藏并禁用；当选择邮寄时，表单字段显示并可用。通过JavaScript实现了表单的动态控制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<input type="radio" class="ziqu" name="SendType" value="0" checked>自取
<input type="radio" class="youji" name="SendType" value="1" >邮寄
<div class="mail" style="display: none">
<label for="HallCode">收件人
<input id="HallCode" name="SendName" class="form-control" value="李坤" type="text">
</label>
<label for="HallName">收件地址
<input id="HallName" name="SendAddressee" value="海南省三亚市天涯区建港路港务局码头12#仓库50号桌" class="form-control" type="text">
</label>
<label for="MailAddress">联系电话
<input id="MailAddress" name="SendMobile" value="18189761549" class="form-control" type="text">
</label>
<label for="MailNum">邮编
<input id="MailNum" name="SendCityCode" value="572000" class="form-control" type="text">
</label>
//送达方式
$(function(){
var ziqu = $(".ziqu").val();
if(ziqu ==1){
$(".mail").find('label input').val('');
$(".mail").find('label input').attr("disabled",true);
$(".mail").hide();
}
$(".ziqu").click(function(){
$(".mail").find('label input').val('');
$(".mail").find('label input').attr("disabled",true);/*点击切换第二次无法编写*/

$(".mail").hide();
});
$(".youji").click(function(){
$(".mail").show();
});
})