Make input non-focusable

http://stackoverflow.com/questions/21185050/jquery-on-click-no-focus-on-readonly-input-field-in-firefox/

by hibbard_eu

HTML

<input class="field" type="text" maxlength="10" />
<span class="counter"></span>

CSS

.counter {
    display: inline-block;
    margin-left: 15px;
    border-radius: 15px;
    background: gray;
    color: white;
    width : 50px;    
    text-align : center;
    cursor: default;
}

JavaScript

$("input[type='text']").on("keyup", function (event) {
    var noChars = $(this).val().length;
    $(this).next().text(noChars);
});

$("input[type='text']").trigger("keyup");