Javascript 这个If/Else代码有什么问题？

我有一个“更改”按钮，当单击时，该按钮使窗体处于活动状态或锁定状态。虽然该按钮仅在我单击“更改”时起作用，但随后不起作用：/

<div class="holder">
  <div class="question active">Q1<input id="one" type="text">
<div class="button passive"><input type="button" value="Change" id="changeone"></div></div></div>

$('input#changeone').click(function() {
    if( $('#one').attr('readonly', true) ) {

      $("#changeone").attr('value', 'Save');
      $('div.button').parent().css('background-color', 'red');
      $('#one').attr('readonly', false);

    } else {

      $("#changeone").attr('value', 'Change');
      $('div.button').parent().css('background-color', 'green');
      $('#one').attr('readonly', true);

    }

})

Q1
$（'input#changeone'）。单击（函数（）{
if（$（'#one'）.attr（'readonly'，true））{
$（“#changeone”）.attr（'value'，'Save'）；
$（'div.button'）.parent（）.css（'background-color'，'red'）；
$（'one'）.attr（'readonly'，false）；
}否则{
$（“#changeone”）.attr（'value'，'Change'）；
$（'div.button'）.parent（）.css（'background-color'，'green'）；
$（'one'）.attr（'readonly'，true）；
}
})

谢谢：）

**修正压痕

谢谢大家!！你们反应如此之快，我感谢大家抽出时间：）

你们在

if

中将

只读设置为
真
，而不是得到它。您需要使用来获取值

$('input#changeone').click(function() {
    if( $('#one').attr('readonly') == 'readonly') {
        ...
    } else {
        ...
    }
});

您正在将
if
中的
只读设置为
true
，而不是获取它。您需要使用来获取值

$('input#changeone').click(function() {
    if( $('#one').attr('readonly') == 'readonly') {
        ...
    } else {
        ...
    }
});

需要像这样检查true：

if( $('#one').attr('readonly') == true) )

您也可以只拥有readonly属性本身

<input readonly>

将两者合并为一个语句：

var isReadonly = $('#one').attr("readonly");
if(isReadonly && isReadonly.toLowerCase()!=='false') { 
   // this is readonly
}

需要像这样检查true：

if( $('#one').attr('readonly') == true) )

您也可以只拥有readonly属性本身

<input readonly>

将两者合并为一个语句：

var isReadonly = $('#one').attr("readonly");
if(isReadonly && isReadonly.toLowerCase()!=='false') { 
   // this is readonly
}

试试这个

$('input#changeone').click(function() {
    if( $('#one').attr('readonly')) {

    $("#changeone").attr('value', 'Save');
    $('div.button').parent().css('background-color', 'red');
    $('#one').attr('readonly', false);

} else {

    $("#changeone").attr('value', 'Change');
    $('div.button').parent().css('background-color', 'green');
    $('#one').attr('readonly', true);

}

})

试试这个

$('input#changeone').click(function() {
    if( $('#one').attr('readonly')) {

    $("#changeone").attr('value', 'Save');
    $('div.button').parent().css('background-color', 'red');
    $('#one').attr('readonly', false);

} else {

    $("#changeone").attr('value', 'Change');
    $('div.button').parent().css('background-color', 'green');
    $('#one').attr('readonly', true);

}

})

试试这个

<div class="holder">
  <div class="question active">Q1<input id="one" type="text">
<div class="button passive"><input type="button" value="Change" id="changeone"></div></div></div>

$('input#changeone').click(function() {
    if( $('#one').attr('readonly') == true ) {

    $("#changeone").attr('value', 'Save');
    $('div.button').parent().css('background-color', 'red');
    $('#one').attr('readonly', false);

} else {

    $("#changeone").attr('value', 'Change');
    $('div.button').parent().css('background-color', 'green');
    $('#one').attr('readonly', true);

}

})


Q1
$（'input#changeone'）。单击（函数（）{
if（$（'#one'）.attr（'readonly'）==true）{
$（“#changeone”）.attr（'value'，'Save'）；
$（'div.button'）.parent（）.css（'background-color'，'red'）；
$（'one'）.attr（'readonly'，false）；
}否则{
$（“#changeone”）.attr（'value'，'Change'）；
$（'div.button'）.parent（）.css（'background-color'，'green'）；
$（'one'）.attr（'readonly'，true）；
}
})
试试这个

<div class="holder">
  <div class="question active">Q1<input id="one" type="text">
<div class="button passive"><input type="button" value="Change" id="changeone"></div></div></div>

$('input#changeone').click(function() {
    if( $('#one').attr('readonly') == true ) {

    $("#changeone").attr('value', 'Save');
    $('div.button').parent().css('background-color', 'red');
    $('#one').attr('readonly', false);

} else {

    $("#changeone").attr('value', 'Change');
    $('div.button').parent().css('background-color', 'green');
    $('#one').attr('readonly', true);

}

})


Q1
$（'input#changeone'）。单击（函数（）{
if（$（'#one'）.attr（'readonly'）==true）{
$（“#changeone”）.attr（'value'，'Save'）；
$（'div.button'）.parent（）.css（'background-color'，'red'）；
$（'one'）.attr（'readonly'，false）；
}否则{
$（“#changeone”）.attr（'value'，'Change'）；
$（'div.button'）.parent（）.css（'background-color'，'green'）；
$（'one'）.attr（'readonly'，true）；
}
})
$（“#one”）.attr（'readonly'，true）
将
只读属性设置为
true
。您需要阅读并将其与
true

if ($('#one').attr('readonly') == true) // ...

$（“#one”）.attr（'readonly'，true）
将
readonly
属性设置为
true
。您需要阅读并将其与
true

if ($('#one').attr('readonly') == true) // ...

应该是

$（'input#changeone'）。单击（函数（）{
if（$（'#one'）.attr（'readonly'））{

})

相反
应该

$（'input#changeone'）。单击（函数（）{
if（$（'#one'）.attr（'readonly'））{

})

相反
那么它应该是这样的（$（'#one'）.attr（readonly）=true）{？这取决于，正确的readonly属性应该在标记中设置为
readonly=“readonly”
，因此肯定的测试是
attr（'readonly'）='readonly'
。然而正如@Mrchief所指出的，可能有一个独立的属性（无效的XHTML）。如果您可以控制正确设置readonly属性，那么上面的比较就可以了。那么它应该是这样的（$（'#one'）。attr（readonly）=true{？这取决于具体情况，正确的readonly属性应该在标记中设置为
readonly=“readonly”
，因此肯定测试是
attr（'readonly'））=='readonly'
。但是正如@Mrchief所指出的，可能有一个独立的属性（无效的XHTML）。如果您能够正确设置readonly属性，那么上面的比较就可以了。