Как я могу добавить и удалить атрибут, “только для чтения”?

$(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);
  }
  ***/
});

Вот мои примеры кода.

<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>

Я также добавил doctype:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
20
задан question_about_the_problem 22 March 2010 в 23:47
поделиться

3 ответа

Да, наконец-то я нашел решение. Я использовал функцию onChange.

<!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>
31
ответ дан 29 November 2019 в 23:48
поделиться

Здесь отлично работает во всех основных моих браузерах. Вот SSCCE :

<!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>

При его переключении фон становится серым (хотя не все браузеры это делают), а ввод не редактируется (это одинаково для всех веб-браузеров). Значит, ваша проблема в другом. Вы, вероятно, используете плохой doctype и, возможно, также в сочетании с плохим веб-браузером.

5
ответ дан 29 November 2019 в 23:48
поделиться

В то время как свойство readonly принимает логическое значение, атрибут readonly принимает строковое значение. Вы должны использовать код, который вы закомментировали:

$("#rate").attr("readonly", "readonly");
4
ответ дан 29 November 2019 в 23:48
поделиться
Другие вопросы по тегам:

Похожие вопросы: