jquery - 填写所有输入字段后显示链接

Question

我尝试使用 jquery 检查带有动态创建的表单字段的表单，以确保在提交之前所有输入字段均已填写。我想隐藏提交链接，直到所有字段都填满。这就是我到目前为止所拥有的。

$( 'form#form_id' ).change(function(e) {
 $(":input").each(function() {
    if($(this).val() === ""){
        $("#showlink").hide();
      }else{
        $("#showlink").show();
      }
    });
});
<div id="showlink">
        <a href="#" id="submitBtnId" onclick="addDuctClickHandler();" data-icon="check" data-role="button" data-inline="true" data-theme="b">Submit Final Test</a>
</div>

我在这里遗漏了什么吗？

Answer 1

这应该可以解决问题:

// check for the change of any input in the form
$('#form_id :input').change(function(e) {

    // if any of the values are blank hide the link
    if ($('#form_id :input').map(function(idx, elem) {
            if ($(elem).val() === "") return $(elem);
        }).size() > 0)
        $("#showlink").hide();
    else
        $("#showlink").show();
});

您的代码的问题在于它将更改处理程序附加到整个表单而不是输入；我什至不确定这会产生什么影响。此外，您还使用 each 函数迭代整个文档中的所有输入，而不仅仅是表单，并且将根据每个输入的值显示和隐藏链接，因此最终链接将仅根据迭代中检查的最后一个值可见或隐藏。