Javascript 禁用提交，除非所有文本区域都已填满

Question

我希望在激活提交按钮之前完成表单中的各种文本区域。我已经对此进行了研究并且已经找到了如何指定特定的 textareas/inputs 但是取决于用户组将取决于显示的文本区域的数量所以我需要一个毯子 javascript 来检查是否显示了任何文本区域在激活提交按钮之前填写页面上的内容。

我看过这个：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');
    }
});   
 })()

这可能是因为我创建文本区域的方式？如下图

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

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

如果不是所有的文本区域都被填充（没有指定每个文本区域），有什么方法可以禁用提交按钮吗？我已经使用 JSFiddle 示例相应地编辑了我的提交按钮。

Answer 1

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

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

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

Answer 2

为什么你认为 textarea 是一个 input？下面是当您在一种形式中具有输入和文本区域时的情况的代码，并且如果其中一个输入或文本区域为空，您希望禁用该按钮。 input 和 textarea 是不同的 html 元素！你不能 select textarea 与 "input".

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

仅文本区域使用：

$('form > textarea')

更好的方法是使用 class 名称，例如 "must_be_filled" 并将此 class 分配给任何 html 元素。

您可以 select 个元素：

$('form > .must_be_filled')

试试这个：

http://jsfiddle.net/g0m79p81/

Javascript 禁用提交，除非所有文本区域都已填满

Javascript disable submit unless all text areas filled

html

javascript

forms

jquery

textarea