Jquery 当我单击一个div时，如何禁用其他div

我有两个部门叫“是”和“不是”

我得说
对
我得说
不

和一个隐藏的输入

<input type="hidden" id="hdnYesNoAnswer" value="" name="hdnYesNoAnswer" runat="server" />

现在，当我点击“Yes”div时，“No”div将被禁用，反之亦然。 可点击的值将被指定为隐藏的输入值。现在的问题是，当我单击“否”div时，它不会更改任何内容，“是”div也没有禁用。请任何人帮帮我。 我正在尝试以下代码

<script>
       $(document).ready(function () {

           if ($('#<%=btnYes.ClientID %>').click(function () {
               $('#<%=btnYes.ClientID %>').html("Counted");
               $('#<%=btnNo.ClientID %>').disable();
               $('#<%=hdnYesNoAnswer.ClientID %>').val('1');
           }));
           else if($('#<%=btnNo.ClientID %>').click(function () {
               $('#<%=btnNo.ClientID %>').html("counted");
               $('#<%=btnYes.ClientID %>').disable();
               $('#<%=hdnYesNoAnswer.ClientID %>').val('0');
           }));
       });
</script>

$（文档）.ready（函数（）{
如果（$（'#'）。单击（函数（）{
$（'#'）.html（“计数”）；
$（'#'）。禁用（）；
$（'#'）.val（'1'）；
}));
else if（$（'#'）。单击（函数（）{
$（'#'）.html（“计数”）；
$（'#'）。禁用（）；
$（'#'）.val（'0'）；
}));
});

实际上，无法禁用div

这是按钮或输入字段的属性。但是，您可以尝试隐藏它或将其样式更改为“禁用”。但是不能将

禁用的
属性显示到div

下面是该代码的示例

<div id="object">
    <div class="object-content">
        I'd say
        <div class="confirm" id="btnYes">Yes</div>
    </div>
    <div class="object-content" style="float: right">
        I'd say
        <div class="confirm" style="color: red"  id="btnNo">No</div>
    </div>
</div>

这将检查元素的id，然后根据条件更改UI。它会隐藏另一个按钮。
实际上，您不能禁用divs，因此您可能需要稍微更改代码：

<div id="object">
    <div class="object-content">
        I'd say
        <div class="confirm" id="btnYes" runat ="server" >Yes</div>
        <div class="disable"></div>
    </div>
    <div class="object-content" style="float: right">
        I'd say
        <div class="confirm" style="color: red"  id="btnNo" runat="server">No</div>
        <div class="disable"></div>
    </div>
</div>

然后使用以下jQuery代码：

<script>
   $(document).ready(function () {
       $('#btnYes, #btnNo').click(function(){
           $(this).parent().siblings('.object-content').children('.disable').css('display','block');
       });
   });
</script>


$（文档）.ready（函数（）{
$（'#btnYes，#btnNo'）。单击（函数（）{
$（this）.parent（）.sides（'.object content'）.children（'.disable'）.css（'display'，'block'）；
});
});

好了，您刚刚禁用了div。
Well div不是一个输入元素，因此您无法禁用它。但无论如何，你可以做一个把戏，感觉它像残疾人。
在CSS中创建一个类，在灰色背景和白色文本颜色的帮助下使元素看起来像是禁用的。如果用户单击No，则将该类应用于Yes Div，反之亦然。然后，您还可以将几个javascript行右转，这将限制禁用div上的单击操作。您可以根据您的类别识别禁用的div。。。我希望这有点道理：）

例如，在CSS文件中创建类，如下所示

.disabledDiv{
 backgrund-color:gray;
 color : white;
}

这样做之后，下一步是根据用户操作将该类应用于div

<script>
       $(document).ready(function () {

           if ($('#<%=btnYes.ClientID %>').click(function () {
              if($(this).hasClass("disabledDiv")) return false;
               $('#<%=btnYes.ClientID %>').html("Counted");
               $('#<%=btnNo.ClientID %>').addClass("disabledDiv");
               $('#<%=hdnYesNoAnswer.ClientID %>').val('1');
           }));
           else if($('#<%=btnNo.ClientID %>').click(function () {
              if($(this).hasClass("disabledDiv")) return false;
               $('#<%=btnNo.ClientID %>').html("counted");
               $('#<%=btnYes.ClientID %>').addClass("disabledDiv");
               $('#<%=hdnYesNoAnswer.ClientID %>').val('0');
           }));
       });
    </script>


$（文档）.ready（函数（）{
如果（$（'#'）。单击（函数（）{
if（$（this）.hasClass（“disabledDiv”））返回false；
$（'#'）.html（“计数”）；
$（'#'）.addClass（“disabledDiv”）；
$（'#'）.val（'1'）；
}));
else if（$（'#'）。单击（函数（）{
if（$（this）.hasClass（“disabledDiv”））返回false；
$（'#'）.html（“计数”）；
$（'#'）.addClass（“disabledDiv”）；
$（'#'）.val（'0'）；
}));
});

确保在每次新加载时都从两个div中删除该类。
下面是一个关于您可以做什么的示例

请注意，这只工作一次，它将隐藏
div
。您还必须更改您的id，以符合您的问题

<div id="object">
    <div class="object-content" style="float:left;">I'd say
        <div class="confirm" id="btnYes" runat="server">Yes</div>
    </div>
    <div class="object-content" style="float: right">I'd say
        <div class="confirm" style="color: red" id="btnNo" runat="server">No</div>
    </div>
    <input id="hdnYesNoAnswer"></input>
</div>

您可能会尝试以下示例：

html

<div id="object">
    <div class="object-content enabled">
        I'd say
        <div class="confirm" id="btnYes" runat ="server" >Yes</div>
    </div>
    <div class="object-content right disabled">
        I'd say
        <div class="confirm" style="color: red"  id="btnNo" runat="server">No</div>
    </div>
    <input type="hidden" id="hdnYesNoAnswer"/>
</div>

使用此脚本

$(".confirm").on("click",function(){

        $(".confirm").removeClass("disabledDiv");
        if($(this).attr("id")== "btnNo")
        {
            $("#btnYes").addClass("disabledDiv");
        }else if($(this).attr("id")== "btnYes")
        {

            $("#btnNo").addClass("disabledDiv");
        }
});

伤残组？！那到底是什么？那么请指导我如何编码。你说的禁用是什么意思？是否要隐藏另一个
div
？请检查这个。@user3751277，现在看看。：）
<div id="object">
    <div class="object-content" style="float:left;">I'd say
        <div class="confirm" id="btnYes" runat="server">Yes</div>
    </div>
    <div class="object-content" style="float: right">I'd say
        <div class="confirm" style="color: red" id="btnNo" runat="server">No</div>
    </div>
    <input id="hdnYesNoAnswer"></input>
</div>

$(document).ready(function () {

    if ($('#btnYes').click(function () {
        $('#btnYes').html("Counted");
        $('#btnNo').hide();
        $('#hdnYesNoAnswer').val('1');
    }));
    if ($('#btnNo').click(function () {
        $('#btnNo').html("counted");
        $('#btnYes').hide();
        $('#hdnYesNoAnswer').val('0');
    }));
});

<div id="object">
    <div class="object-content enabled">
        I'd say
        <div class="confirm" id="btnYes" runat ="server" >Yes</div>
    </div>
    <div class="object-content right disabled">
        I'd say
        <div class="confirm" style="color: red"  id="btnNo" runat="server">No</div>
    </div>
    <input type="hidden" id="hdnYesNoAnswer"/>
</div>

$(function()
{
    $(".object-content").on('click', function()
    {
        if($(this).hasClass("disabled"))
        {
            return;
        }
        $(".object-content").toggleClass("disabled", "enabled");
        var id = $(this).find(".confirm").eq(0).prop("id");
        var v = "btnNo" === id ? '0' : '1';
        $("#hdnYesNoAnswer").val(v);
    });
});

$(".confirm").on("click",function(){

        $(".confirm").removeClass("disabledDiv");
        if($(this).attr("id")== "btnNo")
        {
            $("#btnYes").addClass("disabledDiv");
        }else if($(this).attr("id")== "btnYes")
        {

            $("#btnNo").addClass("disabledDiv");
        }
});