Javascript 在单选按钮列表上显示确认消息框单击事件

我有一个单选按钮列表（radio1，radio2，radio3）在一个分区内

当我单击其中一个收音机时，我隐藏并显示一个包含一些复选框的div。 单击单选按钮后，我需要确保取消选中已选中的复选框

因此，用户每次可以选择一个单选按钮，并选中与Div相关的复选框。 若用户选择radio2，那个么我应该能够取消选中除radio2之外的其他div的所有内容

我能够实现上面的senario，用下面的代码

但问题是： -假设已选中radio2，并且用户再次单击radio2：则取消选中radio2的内容。我需要停下来

我想添加一个确认消息框（ok和cancel按钮），每次单击都会警告用户。如果用户单击“取消”，则应将状态保持为现有状态

我已经为此编写了一个函数，但它不起作用

<div id="radioDiv">                    
    <asp:RadioButtonList ID="radioList" runat="server" >
        <asp:ListItem Value="0" >NewYork</asp:ListItem>
        <asp:ListItem Value="1" >London</asp:ListItem>
        <asp:ListItem Value="2" >Paris</asp:ListItem>
    </asp:RadioButtonList>
</div> 

<div id=nyDiv>
    <asp:CheckBox ID="nycheck1" runat="server" ></asp:CheckBox>
        <asp:CheckBox ID="nycheck2" runat="server" ></asp:CheckBox>
</div>
<div id=ldDiv>
    <asp:CheckBox ID="ldcheck1" runat="server" ></asp:CheckBox>
        <asp:CheckBox ID="ldcheck2" runat="server" ></asp:CheckBox>
</div>
<div id=paDiv>
    <asp:CheckBox ID="pacheck1" runat="server" ></asp:CheckBox>
        <asp:CheckBox ID="pacheck2" runat="server" ></asp:CheckBox>
</div>



function showCity(city) {
    jQuery('#radioDiv input').click(function () {
        //Show confirm message  
        showConfirmMessage('#radioDiv input:radio:checked');

        //Show Hide div
        if (jQuery('#radioDiv input:radio:checked').val() == ) {
            jQuery('#nyDiv').css("display", "block");
            jQuery('#ldDiv').css("display", "none");
            jQuery('#paDiv').css("display", "none");
        }
    }
}


function showConfirmMessage(radioDiv) {
    if (jQuery(radioDiv).val() == 0) {
        var result = confirm("Moving to another city will result in loosing all the existing changes.");
        if (result) {
            return true;
        } else {
            return false;
        }
    }
}

纽约
伦敦
巴黎
功能展示城（城市）{
jQuery（“#radioDiv输入”）。单击（函数（）{
//显示确认消息
showConfirmMessage（“#radioDiv输入：收音机：已选中”）；
//显示隐藏div
if（jQuery（'#radioDiv输入：radio:checked'）.val（）=）{
jQuery（'#nyDiv'）.css（“显示”、“块”）；
jQuery（'#ldDiv'）.css（“显示”、“无”）；
jQuery（'#paDiv'）.css（“display”，“none”）；
}
}
}
函数showConfirmMessage（radioDiv）{
if（jQuery（radioDiv）.val（）==0）{
var result=confirm（“迁移到另一个城市将导致失去所有现有更改”）；
如果（结果）{
返回true；
}否则{
返回false；
}
}
}

那么您的意思是，当单击收音机并显示相应的复选框时，再次单击该收音机会将这些复选框重置为默认值

如果是这种情况，那么您不能添加一个“活动”类或类似的内容，以便在第一次单击单选按钮后将其标记为正在使用中。然后，当您再次单击该单选按钮时，请在重置复选框之前检查该单选按钮是否具有活动类

因此，基本上，如果用户再次尝试单击单选按钮，只需禁用该单选按钮，然后在单击其他单选按钮时重新启用它

请原谅psuedo代码，我在公共汽车站。我回家后会举个例子

编辑

只是我认为你正在做的事情的简化版本。转换过来应该不会太难。我在小提琴上留下了很多评论

HTML

---

你收到错误信息了吗？是的，这正是我要找的。如果你能举个例子，我将不胜感激。

<form>
<input class="radios" type="radio" name="r" value="male">r1</input>
<br/>
<input class="radios" type="radio" name="r" value="female">r2</input>
<br/>
<input class="radios" type="radio" name="r" value="male">r3</input>
<br/>
</form>
<div id="checkBoxes">
<input type="checkbox" name="vehicle" value="Bike">I have a bike</input>
<br/>
<input type="checkbox" name="vehicle" value="Car">I have a car</input>
<br/>
<input type="checkbox" name="vehicle" value="Bike">I have a wife</input>
<br/>
<input type="checkbox" name="vehicle" value="Car">I have a stupid fat dog</input>
</div>

$(".radios").on("click", function () {
    if (!$this.hasClass("active")) {
        $(".radios").removeClass("active");
        $this.addClass("active");
        $("#checkBoxes").show();
        alert("I'm not selected, get me check boxes!");
    }else{ 
        //the checkboxes for that radio are currently being displayed
        //don't reset your checkboxes!
        //whatever else needs to be here
        alert("I'm already selected, do nothing!");
    }
});