如何仅使用javascript更改要禁用的表单中的所有元素?

时间:2013-10-26 07:08:16

标签: javascript

我有这个HTML:

     <div id="account-form">
        <form action="/Account/Login" id="login-form" class="form" method="post">
            <div id="input-fields">
                <div>
                    <input class="medium-margin" id="UserName" name="UserName">
                </div>
                <div>
                    <input class="medium-margin" id="Password" name="Password">
                </div>
            </div>
            <button class="medium glossy" id="login" type="submit">Login</button>
            <button class="medium glossy" id="register" type="button" onclick="location.href='/Account/Register'">Register</button>
        </form>
    </div>

我正在使用以下功能禁用按钮:

   document.getElementById("login").disabled = true;
   document.getElementById("register").disabled = true;

我想要禁用<input><button>。有没有办法我可以做到这一点,而不是通过Id得到每个元素。

6 个答案:

答案 0 :(得分:1)

试试这个:

$(".medium-margin").attr('disabled','disabled');

您可以按类名

来完成

答案 1 :(得分:0)

获取以下元素:document.getElementsByTagName('input')document.getElementsByTagName('button')

答案 2 :(得分:0)

您可以使用带有返回集合HTML元素的getElementsByTagName来获取元素

var inputs = document.getElementsByTagName("input");
for (i = 0; i < inputs.length; i++) {
    inputs[i].disabled  = true;
}

Demo

答案 3 :(得分:0)

<div id="account-form">
        <form action="/Account/Login" id="login-form" class="form" method="post">
            <div id="input-fields">
                <div>
                    <input class="medium-margin" id="UserName" name="UserName">
                </div>
                <div>
                    <input class="medium-margin" id="Password" name="Password">
                </div>
            </div>
            <button class="medium glossy" id="login" type="submit" disabled>Login</button>
            <button class="medium glossy" id="register" type="button" onclick="location.href='/Account/Register'" disabled>Register</button>
        </form>
    </div>

我认为以上代码适合您。试试吧。

答案 4 :(得分:0)

试试这个: -

$('input').attr('disabled',true);

$('button').attr('disabled',true);

答案 5 :(得分:0)

使用Javascript:

var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
     inputs[i].disabled = true;
}

如果要禁用多个按钮,可以使用相同的方法。

使用jQuery:

 $('input').each(function() {

                $(this).attr({
                    'disabled': 'disabled'
                });

        });