使用 jquery 切换属性答案

【问题标题】：Toggling a property with jquery使用 jquery 切换属性
【发布时间】：2014-10-22 11:09:11
【问题描述】：

尝试制作一个简单的切换按钮。

解释一下：

输入具有禁用属性

用户按下按钮禁用变为假

用户按下保存更改，按钮再次被禁用。

这是我的代码

$('#password').click(function(){
    if($("#password") === "disabled"){
        $("#password").prop("disabled", false);
    } else if ($("#password").prop("disabled", false)){
        $("#password").prop("disabled", true);
    }
});

旁注：我正在使用引导程序

【问题讨论】：

一个可能的例子是：<input type="password" disabled="true"/> <button onclick="document.getElementsByTagName('input')[0].disabled=false">Enable</button> <button onclick="document.getElementsByTagName('input')[0].disabled=true">Save</button>

标签： jquery button toggle

【解决方案1】：

Try like;

$('#password').click(function(){
    if($(this).is(':disabled')){
        $(this).removeAttr('disabled');
    } 
    else {
        $(this).attr('disabled','disabled');
    }
});

【讨论】：

【解决方案2】：

禁用的表单元素不会触发任何鼠标事件，您的事件处理函数将永远不会被调用。即使是..
jQuery 集合 ($("#password")) 永远不会等于字符串文字 "disabled"，尽管它是一个真实值，但您已经使用了 ===。无论如何，我很确定您正在寻找
```
if( $('#password').prop('disabled') ) {
```
.prop() 的 setter 版本返回原始集合，因此始终是真值。

默认启用<input>，并在提交表单时禁用它（假设您使用的是表单..）：

$('#myForm').submit(function(){
    $('#password').prop('disabled', true); 
});

【讨论】：

【解决方案3】：

试试看；

> $('#password').click(function(){
>     if($(this).is(':disabled')){
>         $(this).removeAttr('disabled');
>     } 
>     else {
>         $(this).attr('disabled','disabled');
>     } });

【讨论】：

【解决方案4】：

所以这就是我修复它以供将来参考的方法。

这是当按钮的 id = "#password-button" 并且输入 id="password"

       $(function() {
            $('#password-button').click(function() {
                if ($("#password").prop("disabled")) {
                    $("#password").prop("disabled", false);
                } else {
                    $("#password").prop("disabled", true);
                }
            });
        });

【讨论】：