jQuery on click no focus on readonly input field (in Firefox)

Question

I'm trying to create an input field that shows realtime the number of characters in another input field. I don't want focus on that counter field when a user clicks on it and that field is readonly. In Chrome the field doesn't get a focus, only readonly is necessary, but in Firefox it still get a focus when I click on it. I tried to prevent this with for example blur() but it doesn't work. What am I doing wrong or what is the solution for this?

$(function(){
$("input[type='text']").on("keyup", function(event){ 
    $(".counter").blur();
    $("#counter_1").val($(this).val().length);
    }); 
});

http://jsfiddle.net/67Bpa/3/

Answer 1

Just blur the field whenever it gets focus

$("#myFieldIdontWantFocusOn").on("focus", function(){
  $(this).blur();
});

Fiddle

EDIT:

Updated fiddle to incorporate A.Wolff's observation above.