Javascript 如何添加和删除属性"；只读；？_Javascript_Jquery

Javascript 如何添加和删除属性"；只读；？

javascript jquery

Javascript 如何添加和删除属性"；只读；？,javascript,jquery,Javascript,Jquery,这是我的示例代码 $(document).ready(function() { //Check City Value var city_value = parseInt($("#city").val()); if( city_value == 0) { $("#state").attr("readonly", true); //$("#rate").attr("readonly", "readonly"); } else { $("#state

这是我的示例代码

$(document).ready(function() {
  //Check City Value
  var city_value = parseInt($("#city").val());
  if( city_value == 0) {
     $("#state").attr("readonly", true);
     //$("#rate").attr("readonly", "readonly");   
  } else {
     $("#state").removeAttr("readonly");
     //document.getElementById("state").removeAttribute("readonly",0);
     //get_states(city_value);
  }
 /***
  //Check State Value
  var state_value = parseInt($('#state').val());
  if( state_value == 0) {
      $('#rate').attr('readonly', true); 
  } else {
     $('#rate').attr('readonly', false);
  }
  ***/
});


请选择文本
安塔利亚
博德鲁姆
伊斯坦布尔

我还添加了doctype：

<td><select name="city" id="city">
<option value="0">PLEASE_SELECT_TEXT</option>
<option value="Antalya">Antalya</option>
<option value="Bodrum">Bodrum</option>
<option value="Istanbul">Istanbul</option>
</select>&nbsp;</td>
<td><div id="states"><input type="text" name="state" value="FORCE_FOR_SELECT" readOnly id="state"></div></td>

在我拥有的所有主要浏览器中都能正常工作。这是一个：


所以问题2496443
$（文档）.ready（函数（）{
$（“#切换”）。单击（函数（）{
$（'foo'）.attr（'readonly'，！$（'foo'）.attr（'readonly'）；
});
});
输入[只读]{
背景：浅灰色；
}
切换只读

切换它会使背景变灰（尽管并非所有浏览器都这样做），并且输入是不可编辑的（这在所有WebBrowser中是一致的）。所以你的问题在别的地方。您可能正在使用一个糟糕的webbrowser，也可能与一个糟糕的webbrowser结合使用。

当

readonly

属性采用布尔值时，

readonly

属性采用字符串值。您应该使用注释掉的代码：

<!doctype html>
<html lang="en">
    <head>
        <title>SO question 2496443</title>
        <script src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script>
            $(document).ready(function() {
                $('#toggle').click(function() {
                    $('#foo').attr('readonly', !$('#foo').attr('readonly'));
                });
            });
        </script>
        <style>
            input[readonly] { 
                background: lightgray;
            }
        </style>
    </head>
    <body>
        <input id="foo">
        <button id="toggle">toggle readonly</button>
    </body>
</html>

是的，我终于找到了解决办法。我使用了onChange函数

$("#rate").attr("readonly", "readonly");


//$（文档）.ready（函数（）{
功能检查城市（城市值）{
//检查城市价值
城市值=$（“#城市”）.val（）；
如果（城市值=“0”）{
$（“#state”）.attr（“只读”，true）；
//$（“#rate”）.attr（“只读”、“只读”）；
}否则{
$（“#state”）.attr（“只读”，false）；
//$（“#state”）.removeAttr（“只读”）；
//document.getElementById（“state”）.removeAttribute（“只读”，0）；
//获取州（城市值）；
}
/***
//检查状态值
var state_value=parseInt（$（'#state'）.val（）；
如果（状态_值==0）{
$（'#rate'）.attr（'readonly'，true）；
}否则{
$（'#rate'）.attr（'readonly'，false）；
}
***/
//});
}
请选择文本
安塔利亚
博德鲁姆
伊斯坦布尔

您可以在纯JavaScript中执行此操作（或），而不使用：

设置属性

只读

：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
//$(document).ready(function() {
function check_city(city_value) {
  //Check City Value
  city_value = $("#city").val();
  if( city_value == "0") {
     $("#state").attr("readonly", true);
     //$("#rate").attr("readonly", "readonly");   
  } else {
     $("#state").attr("readonly", false);
     //$("#state").removeAttr("readonly");
     //document.getElementById("state").removeAttribute("readonly",0);
     //get_states(city_value);
  }
 /***
  //Check State Value
  var state_value = parseInt($('#state').val());
  if( state_value == 0) {
      $('#rate').attr('readonly', true); 
  } else {
     $('#rate').attr('readonly', false);
  }
  ***/
//});
}
</script>

<td><select name="city" id="city" onChange="check_city(this.value)">
<option selected value="0">PLEASE_SELECT_TEXT</option>
<option value="Antalya">Antalya</option>
<option value="Bodrum">Bodrum</option>
<option value="Istanbul">Istanbul</option>
</select>&nbsp;</td>
<td><div id="states"><input type="text" name="state" value="FORCE_FOR_SELECT" readonly id="state"></div></td>

和取消设置：

document.getElementById("state").readOnly = true;

与面向对象的表示法等效的也是这种面向数组的表示法：

在JavaScript中，所有属性都区分大小写也很重要，因此记住
readOnly
属性中的大
O
很重要，否则它将无法工作…
您的代码已经做到了这一点。你能再详细说明一下这个问题吗？究竟发生了什么，没有发生什么？如果可以的话，你能不能也用SSCCE的风格再发一次？别忘了包括doctype并告诉我你尝试过的浏览器。那不起作用，我真的不知道问题出在哪里。页面上没有JavaScript错误和操作。而且输入类型（文本）仍然是“readonly”…jQuery足够聪明，可以为您翻译它。这同样适用于选中的
等等。不管jQuery如何，这也取决于所使用的doctype。在XHTML中，您需要指定属性值，而在HTML中，您不需要指定任何属性值。
document.getElementById("state").readOnly = true;

document.getElementById("state").readOnly = false;

document.getElementById("state")['readOnly']