首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >php表单提交时,提交按钮禁用

php表单提交时,提交按钮禁用
EN

Stack Overflow用户
提问于 2018-05-31 17:44:29
回答 2查看 60关注 0票数 -2

我已经习惯于在ps1脚本和网络服务上使用php代码从表单中获取数据,所以页面请求需要时间。在这个过程中,用户一次又一次地点击按钮。

我尝试了jQuery点击事件,但它停止了表单提交。

myHTML文件:

代码语言:javascript
复制
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="favicon.ico">

<title>xxx</title> 
<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>   

<script type="text/javascript" src="js/guncelle.js"></script>
<script src='https://www.google.com/recaptcha/api.js'></script>

<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet">
</head>
<div class="bg"></div>
<body class="text-center bg body3">
<div class="cover-container d-flex h-100 p-3 mx-auto flex-column">
   <header class="masthead">
    <div class="inner">
      <!--<h3 class="masthead-brand"><img src="image/xxx.png" style="width: 100px;height: 100px"></h3>-->
      <nav class="navbar navbar-expand-sm navbar-dark justify-content-center">
        <ul class="navbar-nav">
          <li class="nav-item ">
            <a class="nav-link" href="index.php">xxx</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="sifirla.php">Sıfırla</a>
          </li>
          <li class="nav-item active">
            <a class="nav-link" href="guncelle.php">Güncelle</a>
          </li>
        </ul>
      </nav>
    </div>
  </header>
  <div><img src="image/xxx.png"  alt="xxx" style="width: 150px;height: 150px;"></div>

   <div>
      <?php echo $result; ?>       
  </div>

  <main role="main" class="inner cover">
      <form id="form1" name ="form1" method="POST" action="guncelle.php" >

        <div class="form-group">
          <label for="uname">Kullanıcı Adınız:</label>
          <input type="text" class="form-control" id="uname" name="uname" >
        </div>
        <span id="unametxt" name="unametxt" class="required"></span>

        <div class="form-group">
          <label for="password">Mevcut Şifreniz:</label>
          <input type="password" class="form-control" id="password" name="password">
        </div>
        <span id="passwordtxt" name="passwordtxt" class="required"></span>

        <div class="form-group">
          <label for="newPassword">Yeni Şifreniz:</label>
          <input type="password" class="form-control" id="newPassword" name="newPassword" maxlength="15">
        </div>
        <span id="newPasswordtxt" name="newPasswordtxt" class="required"></span>

        <div class="form-group">
          <label for="new2Password">Yeni Şifreniz Tekrar:</label>
          <input type="password" class="form-control" id="new2Password" name="new2Password" maxlength="15">
        </div>
        <span id="new2Passwordtxt" name="new2Passwordtxt" class="required"></span>

        <!--<div class="form-group">
          <div class="g-recaptcha" data-sitekey="6LdLWVsUAAAAANupQHCmg_28mFmc__o6ZwybziOK"></div>
        </div>
      -->

       <p><input class="btn btn-lg btn-guncelle" type="submit" id="Submit1" name="Submit1" value="Şifremi Güncelle"  ></p>


    </form>
  </main>

  <footer class="mastfoot mt-auto">
    <div class="inner">
      <p>@2018 <a href="xxxx" target="_blank">xxxx</a></p>
    </div>
  </footer>
</div>


<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->

<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script> 
</body>
</html>

当这个表单提交时,我像这样控制php端:

if (isset($_POST'Submit1')) {

然后,根据我运行的ps1脚本,我将这些数据用于webservice。最后,我在所有流程的表单错误或成功时显示警告。

我想在提交表单时禁用该按钮。我怎么能这样做呢?

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2018-05-31 18:16:56

您可以在表单中使用onsubmit事件来完成此操作。请在下面的表单中添加onSubmit事件

代码语言:javascript
复制
<form id="form1" name ="form1" method="POST" action="" onsubmit="$('#Submit1').attr('disabled', 'disabled'); return true;">
票数 0
EN

Stack Overflow用户

发布于 2018-10-01 01:03:30

尝试使用此代码

代码语言:javascript
复制
<input class="btn btn-lg btn-guncelle" type="submit" id="Submit1" name="Submit1" value="Şifremi Güncelle">

<script>
$(document).ready(function(){
  $('#form1').on('submit',function(e){
    e.preventDefault();
    $('#submit1').prop('disabled','disabled');
  });
});
</script>
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50621300

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档