Jquery не удается обновить пользовательский атрибут

Question

http://jsfiddle.net/k3Grd/373/

Как вы можете видеть из этой скрипки, я могу установить атрибут, но я не могу изменить его после этого. Есть ли способ исправить это, чтобы я мог его обновить?

Вот код, с скрипкой:

<input type="text" id="tester" value="some data"> 
<div id="one"></div> 
<div id="two"></div> 
<div id="three"></div> 

$(function(){ 
    $('#tester').attr('readonly', 'readonly'); 
    $("#one").html($('#tester').attr('readonly')); 
    $('#tester').attr('readonly', 'true'); 
    $("#two").html($('#tester').attr('readonly')); 
    $('#tester').attr('readonly', 'BROKEN'); 
    $("#three").html($('#tester').attr('readonly')); 
}); 

Выход:

readonly 
readonly 
readonly 

Edit: Обновлен код, чтобы использовать вход. Я не думал, что это будет иметь значение.

Редактировать: Спасибо phillip100 за указание, что я должен использовать prop() not attr(). Кроме того, readonly получает значение false с логическим значением false, но оно всегда верно для строки.

$('#tester').prop('readonly', false); //correct 
$('#tester').prop('readonly', 'false'); //incorrect 

http://jsfiddle.net/k3Grd/378/

Answer 1

Как вы хотите разместить Аттрибут как чтения на один DIV, это не имеет смысла.

Вы можете добавить только для чтения к входам, выбирает, и текстовое поле ....

Answer 2

Изменить .attr() на .data() и он будет работать. Как отметил @DarkteK, readonly предназначен только для полей ввода.