哪一种安全的方法来禁用按钮？

问题描述：

我填写表格中的所有字段后，我有一个表单并启用提交按钮。我使用jquery禁用按钮也使用disabled="disabled"在提交按钮。现在我在浏览器上，按钮显示禁用。哪一种安全的方法来禁用按钮？

现在我做了什么，右键单击并检查元素并进入我的注册按钮，并从HTML中删除disabled=" disabled"，并且我的按钮在未填写详细信息的情况下启用，并且我没有单击提交的按钮表单。

我只想知道有没有其他解决方案来处理这个问题？因为任何人都可以在不填写表单的情况下启用它并访问它。

你能帮我解决吗？

(function() { 
 
    $('form > input').keyup(function() { 
 
     var empty = false; 
 
     $('form > input').each(function() { 
 
      if ($(this).val() == '') { 
 
       empty = true; 
 
      } 
 
     }); 
 
     if (empty) { 
 
      $('#register').attr('disabled', 'disabled'); 
 
     } else { 
 
      $('#register').removeAttr('disabled'); 
 
     } 
 
    }); 
 
})()

<form> 
 
    Username<br /> 
 
    <input type="text" id="user_input" name="username" /><br /> 
 
    Password<br /> 
 
    <input type="password" id="pass_input" name="password" /><br /> 
 
    Email<br /> 
 
    <input type="text" id="email" name="email" /><br />  
 
    <input type="submit" id="register" value="Register" disabled="disabled" /> 
 
</form> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

这是不可能使前端那样的安全，这就是为什么它总是重要添加服务器端验证 – user184994

@ user184994，感谢您的回复，那我知道要添加服务器端验证。我认为还有另一种处理方式。 –

唯一的方法是使用服务器端处理 –

答

禁用的属性是好的，但它或多或少的化妆品。

有一种简单的方法来阻止使用JavaScript提交表单提交事件处理程序。您检查是否符合条件 - 否则您提交取消。

答

您可以防止形式通过简单地修改你的函数此提交：

(function() { 
$('form > input').keyup(function(e) { 
    e.preventDefault(); 
    var empty = false; 
    $('form > input').each(function() { 
     if ($(this).val() == '') { 
      empty = true; 
     } 
    }); 
    if (empty) { 
     $('#register').attr('disabled', 'disabled'); 
    } else { 
     $('#register').removeAttr('disabled'); 
    } 
});

}）（）

哪一种安全的方法来禁用按钮？

相关推荐