禁用“提交”按钮并启动警报,除非选中“复选框”

时间:2011-12-18 19:56:04

标签: jquery forms validation

除此之外,还有其他一些问题告诉您如何禁用提交,除非选中了复选框。我很容易实现这一点。

我遇到的问题是在未选中复选框的情况下单击提交时触发警告框。我想告诉用户“你必须先选择一个选项!”在提交之前。

这是我尝试过的众多版本中的一个。 (这是简化的)感谢伙计们!

<!DOCTYPE HTML>
<html>
<head>
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
</script>
<script type="text/javascript">
  $(document).ready(function(){

        $("form").submit(function(e){
        if($("#terms").not(':checked')){
            e.preventDefault();
            alert('Please check the first checkbox!');
        } 
                         return true;
    }
});



});
</script>
</head>
<body>
<form method="post" action="http://google.com">
    <input type="checkbox" name="cb1" id="terms" value="a" /> A<br />

    <!-- disable our submit button by default -->
    <input type="submit" id="submitButton" value="submit"/>
</form>
</body>
</html>

2 个答案:

答案 0 :(得分:1)

$(document).ready(function ()
{
    $("form").submit(function (e)
    {
        if ($("#terms:not(:checked)").length > 0)
        {
            e.preventDefault();
            alert('Please check the first checkbox!');
            return false;
        }

    });
});

答案 1 :(得分:0)

这应该有效:

 $(document).ready(function(){ 

        $("form").submit(function(e){ 
        if(!$("#terms").is(':checked')){ 
            e.preventDefault(); 
            alert('Please check the first checkbox!'); 
        }  
                         return true; 
    } 
);