表单和 Jquery 代码不起作用。灰显提交按钮

Question

我有一个 HTML 订阅表单，它使用（或应该使用）jquery 代码来灰显提交按钮，直到字段 name 被填写。

但是，它不起作用......

有什么错误的线索吗？代码如下：

<head>
<script type="text/javascript">
var $submit = $("input[type=submit]");
if ( $(".subName").length > 0 ) {
   $submit.attr("disabled","disabled");
} else {
   $submit.removeAttr("disabled");
}
</script>
</head>
<body>
<form action="" method="post" id="subscribe" name="subscribe">
<input type="hidden" name="action" value="subscribe">
<label>NAME:</label>
<input type="text" name="name" class="subName" id="sub_first_name">
<label>EMAIL:</label>
<input type="text" name="email" class="subEmail" id="sub_email">
<input type="submit" name="button" value="Subscribe" />
</form>
</body>

谢谢！

-------------- 编辑

<form action="" method="post" id="subscribe" name="subscribe">
<label>NAME:</label>
<input type="text" name="name" class="subName" id="sub_first_name">
<label>EMAIL:</label>
<input type="text" name="email" class="subEmail" id="sub_email">
<input type="submit" name="button" value="Subscribe" />
</form>

JS：

<script type="text/javascript">
$(document).ready(function() {
    var $submit = $("input[type=submit]");
    $('.subName').on('change', function() {
        if ( ! $(".subName").val().length ) {
           $submit.attr("disabled","disabled");
        } else {
           $submit.removeAttr("disabled");
        }
    });
}
</script>

但还是不行:(

Answer 1

除了将它绑定到事件之外，您是否还在标题中包含 jQuery？比如这样：

<script type="text/javascript" src="js/jquery-1.7.1.js"></script>

Answer 2

$(document).ready(function() {
    var $submit = $("input[type=submit]");
    $('.subName').on('change keyup', function() {
        if ( !$(this).val().length ) {
           $submit.attr("disabled","disabled");
        } else {
           $submit.removeAttr("disabled");
        }
    });
});