Question

嗨，我正在尝试在复选框控件上同时使用angular和jquery。我有两个复选框。选中一个复选框将显示相应的div，因为每个复选框都与一个div相关联。使用我的jquery函数一次也只能选择一个复选框。问题是，当我选择复选框1时，它显示了div1；而当我选择复选框2时，尽管未选中复选框1，但其div没有被隐藏，结果两个div出现在屏幕上。如何使用jquery或angular隐藏相应的div。这是我的代码段：

 <button ng-init="clickedh=false" ng-click="clickedh = !clickedh">Create Ticket</button>

    <br>
     <div class="main1" ng-show="clickedh">
     <input type="checkbox" ng-click="checkbox-2 = false" ng-model="DivTicket" class="subject-list" name="Subject" value="1">Create Ticket</input> <br />
     <input type="checkbox" ng-click="checkbox-1 = false" ng-model="DivRefund" class="subject-list" name="Subject" value="2">Refund Ticket</input>
     </div>

    <div ng-show="DivTicket">
        <h1>Welcome</h1>
        <p>Welcome to Create .</p>
    </div>

    <div ng-show="DivRefund">
        <h1>Welcome</h1>
        <p>Welcome To Request.</p>
    </div>

</body>
<script type="text/javascript">

        $('.subject-list').on('change', function() {

            $('.subject-list').not(this).prop('checked', false);  
            alert($("input[type='checkbox']").val());               
        });
        $(".subject-list:checked").each(function() {
            if($(this).val()=='1'){
              $(.)
            }
            else{

            }

        });
     </script>

Answer 1

由于您一次只希望选中一个复选框，所以为什么不使用单选按钮。

我对您的代码进行了一些更改，请参见下文

<button ng-init="clickedh=false" ng-click="clickedh = !clickedh">Create Ticket</button>
  <br>
  <div class="main1" ng-show="clickedh">
    <input type="radio" ng-model="ticketCategory" value="DivTicket" class="subject-list" name="Subject" />Create Ticket <br />
    <input type="radio" ng-model="ticketCategory" value="DivRefund" class="subject-list" name="Subject" />Refund Ticket
  </div>

  <div ng-switch="ticketCategory">
    <div ng-switch-when="DivTicket">
      <h1>Welcome</h1>
      <p>Welcome to Create .</p>
    </div>
    <div ng-switch-when="DivRefund">
      <h1>Welcome</h1>
      <p>Welcome To Request.</p>
    </div>
  </div>

fiddle

中的工作示例

在更改复选框选择时隐藏div

1 个答案: