时间戳

首页 > 解决方案 > 如何禁用切换按钮？

javascript - 如何禁用切换按钮？

问题描述

这是我的 HTML 代码。

$(function(){
   $("#next").click(function() {
      $("#subject").toggle();
      $("#email").toggle(); 
      $("#next").click(function() {

          $("#content").toggle(); 
          $("#email").toggle(); 

      })
   })

   if ($('#content') == true){
    $('#next').prop('disabled', true);
   }
});

$(function(){});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-container">

    <form method="post" id="email">
        <fieldset class="form-group">
          <label for="email"></label>
          <input type="email" class="form-control"name="email" placeholder="Enter email">
        </fieldset>
    </form>

    <form method="post" id="subject">

        <fieldset class="form-group">
          <label for="subject"></label>
          <input type="text" class="form-control"name="subject"placeholder="Subject" >
        </fieldset>
    </form>

   <form method="post" id="content">
      <fieldset class="form-group">
        <label for="content"></label>
        <textarea class="form-control" name="content" rows="3" placeholder="What would you like me to ask, Sir/Madam?"></textarea>
      </fieldset>
    </form>

    <div id="buttons">
        <button type="submit" id="next" class="btn btn-primary" class='enableOnInput' enabled='enabled'>Next</button>
        <button type="submit" id="submit" class="btn btn-primary">Submit</button>
   </div>
</div>

所以，当表单转到表单的最后一部分时，我试图禁用“下一个按钮” id =“content”。但我做不到。有人可以帮助我吗？感谢您的时间和努力。

标签： javascripthtmljquery

解决方案

检查这一点，只需在您的 #content.toggle() 部分下方添加一行：

$("#next").click(function() {
    
    $("#content").toggle();
    $("#email").toggle();
    $('#next').attr('disabled', true);
                
})

这是小提琴：https ://jsfiddle.net/tjmcr806/

删除您的 IF 语句，因为它现在是多余的。

您可能希望在加载时切换#subject 和#content，如Fiddle 所示。

推荐阅读