Question

我是asp .net MVC 4的新手。

我正在做一个小应用程序。我有一个复选框，一旦我点击该复选框，我应该能够显示两个文本框。在display:none

的帮助下，我将这两个文本框变为不可见

编码

<script type="text/javascript">
       $(document).ready(function () {
         $('#checkbox1').click(function setCompleteStatus() {
            $('#textboxshow').show();
         });
      });


 <tr class="gridAlternateRow">
      <td>
       <span style="color:red;">*</span>&nbsp;Name
      </td>
      <td colspan="4">
          <div class="row">
               @Html.TextBoxFor(m=>m.txtfirstName)
                 <br />
                  @Html.CheckBox("txtChangePrintName", new { @id = "checkbox1", @onclick = "setCompleteStatus()" })
                        <br />
                   <div id="textboxshow">
                        @Html.TextBoxFor(m => m.txtfirstName, new { style = "display:none;", @readonly = "readonly" })
                        @Html.TextBoxFor(m => m.txtLastName, new { style = "display:none;" })
                  </div> 
         </div>
     </td>
</tr>

因为我是mvc 4的新手，所以我无法做到？有人会帮助我吗？

Answer 1

尝试

$('#checkbox1').click(function () {
  $('input[type="text"]').show();
});

并从@onclick = "setCompleteStatus()方法

中删除@Html.CheckBox()

Answer 2

您正在显示div而不是textboxes并关闭<script>标记。当您将click event绑定到checkbox时，无需为复选框设置onclick属性。

<script>
 $(document).ready(function () {
         $('#checkbox1').click(function(){
              $('#textboxshow').children().toggle();
         });
      });
</script>

Answer 3

试试这个：

 $(document).ready(function () {
     $('#checkbox1').click(function() {
        $('#txtfirstName').show();
        $('#txtLastName').show();
     });
  });

并从@onclick = "setCompleteStatus()"中移除@html.checkbox()，因为它仅由Jquery处理。

单击复选框无法正常工作

3 个答案: