Question

实际上我想通过单击编辑按钮启用输入文本，如果再次单击该编辑按钮，输入文本应处于禁用模式。我可以启用但如何禁用。这是我的代码：

<script>
function toggle(){

        document.getElementById("Name").disabled = false;
        document.getElementById("email").disabled = false;
        document.getElementById("contact").disabled = false; 
            }

</script>

<form>
<input type="text" class="form-control" 
            name="name" id="Name" maxlength="30" value="<?=$name; ?>" disabled/>
<input type="text" class="form-control" name="pan" id="pan" value="<?=$pan; ?>" disabled />

<input type="email" class="form-control" name="mail" id="email" value="<?=$email; ?>" disabled />                                                               

<input type="number" class="form-control" name="mobile" id="contact" maxlength="10" value="<?=$mobile; ?>" disabled /> 


<input type="button" name="edit" id="edt" class="btn btn-primary btn-lg btn-block login-button" value="Edit" 
    onclick="toggle()" >    
</form>

请建议我必须在代码中进行更改。

Answer 1

要实现此目的，您只需要在所需元素上反转disabled属性的当前值。为此，请在当前设置之前使用!运算符，如下所示：

＆＃13;

function toggle() {
  document.getElementById("Name").disabled = !document.getElementById("Name").disabled;
  document.getElementById("pan").disabled = !document.getElementById("pan").disabled;
  document.getElementById("email").disabled = !document.getElementById("email").disabled;
  document.getElementById("contact").disabled = !document.getElementById("contact").disabled;
}

＆＃13;

<form>
  <input type="text" class="form-control" name="name" id="Name" maxlength="30" value="<?= $name; ?>" disabled/>
  <input type="text" class="form-control" name="pan" id="pan" value="<?= $pan; ?>" disabled />
  <input type="email" class="form-control" name="mail" id="email" value="<?= $email; ?>" disabled />
  <input type="number" class="form-control" name="mobile" id="contact" maxlength="10" value="<?= $mobile; ?>" disabled />
  <input type="button" name="edit" id="edt" class="btn btn-primary btn-lg btn-block login-button" value="Edit" onclick="toggle()">
</form>

＆＃13;

Answer 2

<button value="false"></button>

$('#btn_pause_resume').click(function () {
    if ($(this).data('value')==='false') {
        alert('Resumed...');
        $(this).data('value', 'true');
    } else {
        alert('Paused...');
        $(this).data('value', 'false');
    }
});

试试这个你应该明白的想法

Answer 3

你可以这样试试。询问元素是否被禁用，然后根据该值设置禁用值。

＆＃13;

function toggle() {

  document.getElementById("Name").disabled = document.getElementById("Name").disabled ? false : true;
  document.getElementById("email").disabled = document.getElementById("email").disabled ? false : true;
  document.getElementById("contact").disabled = document.getElementById("contact").disabled ? false : true;
  document.getElementById("pan").disabled = document.getElementById("pan").disabled ? false : true;
}

＆＃13;

<input type="text" class="form-control" name="name" id="Name" maxlength="30" value="<?=$name; ?>" disabled/>
<input type="text" class="form-control" name="pan" id="pan" value="<?=$pan; ?>" disabled />

<input type="email" class="form-control" name="mail" id="email" value="<?=$email; ?>" disabled />

<input type="number" class="form-control" name="mobile" id="contact" maxlength="10" value="<?=$mobile; ?>" disabled />


<input type="button" name="edit" id="edt" class="btn btn-primary btn-lg btn-block login-button" value="Edit" onclick="toggle()">

＆＃13;

Answer 4

function toggle() {
  var enable = (this.disabled);
  document.getElementById("Name").disabled = enable;
  document.getElementById("pan").disabled = enable
  document.getElementById("email").disabled = enable;
  document.getElementById("contact").disabled = enable;
};

<input type="text" class="form-control" name="name" id="Name" maxlength="30" value="<?=$name; ?>" disabled/>
<input type="text" class="form-control" name="pan" id="pan" value="<?=$pan; ?>" disabled />

<input type="email" class="form-control" name="mail" id="email" value="<?=$email; ?>" disabled />

<input type="number" class="form-control" name="mobile" id="contact" maxlength="10" value="<?=$mobile; ?>" disabled />


<input type="button" name="edit" id="edt" class="btn btn-primary btn-lg btn-block login-button" value="Edit" onclick="toggle()">

单击同一按钮

4 个答案: