Javascript禁用提交,除非填写所有文本区域

时间:2015-07-19 12:46:02

标签: javascript jquery html forms textarea

我希望在激活提交按钮之前完成表单中的各种textareas。我已经研究过这个并且已经找到了如何指定特定的textareas /输入但是依赖于用户组将取决于显示多少文本区域所以我需要一个毯子javascript来检查页面上显示的任何textareas之前是否填充提交按钮已激活。

我看过这个:http://jsfiddle.net/qKG5F/641/但是我自己没有成功地实现它。

(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');
    }
});   
 })()

这可能是因为我创造了我的textareas吗?如下图所示

<textarea name="i_2" id="i_2" class="input-block-level"></textarea>

而不是像上面的JSFiddle示例那样使用<input>

如果没有填写所有textareas(没有指定每个textarea),有没有办法禁用提交按钮?我已经使用JSFiddle示例相应地编辑了我的提交按钮。

2 个答案:

答案 0 :(得分:1)

在HTML5中,您可以使用非常简单的“必需”命令,在激活提交按钮之前,将任何表单元素设置为必填字段。它消除了对任何不必要的JavaScript的需要。

<textarea name="i_2" id="i_2" class="input-block-level" required></textarea>

试一试:)这样的东西就是我喜欢HTML5的原因

答案 1 :(得分:0)

为什么您认为 textarea 输入?下面是在一个表单中有输入和textareas的情况的代码,并且如果其中一个输入或textareas为空,则希望禁用该按钮。输入和textarea是不同的html元素!您无法使用&#34;输入&#34;选择textarea。

(function() {
    $('form > input, form > textarea').keyup(function() {

        var empty = false;
        $('form > input, form > textarea').each(function() {
            if ($(this).val() == '') {
                empty = true;
            }
        });

        if (empty) {
            $('#register').attr('disabled', 'disabled');
        } else {
            $('#register').removeAttr('disabled');
        }
    });
})()

仅限textareas使用:

$('form > textarea')

更好的方法是使用类名,例如&#34; must_be_filled&#34;并将此类分配给任何html元素。

您可以通过以下方式选择元素:

$('form > .must_be_filled')

试试这个:

http://jsfiddle.net/g0m79p81/