CODEWITHSUNDEEP
javascripthtmlcss
PaolaJ.
PaolaJ.

Reputation: 11582

to make that input text field holds focus and not to lose when I click on something else (to focus always be on input with id="input_message")?

I made simple web chat, bubles ( messages) above one text field (input message) and send button. How to make that input text field holds focus and not to lose when I click on something else (to focus always be on input with id="input_message") ?

Upvotes: 0

Views: 6258

Answers (3)

Ahmad Sharif
Ahmad Sharif

Reputation: 4435

var inputElement = document.getElementById("input_message");
    inputElement.focus();
    inputElement.addEventListener("blur", function(event){
        inputElement.focus();
    });

http://jsfiddle.net/653w1mpv/

Upvotes: 0

inhan
inhan

Reputation: 7470

Here's a dirty hack.

<input type="text" id="input_message" />
<script type="text/javascript">
    with (document.getElementById('input_message')) {
        onblur = function(e) {
            var elm = e.target;
            setTimeout(function(){elm.focus()});
        }
        onkeydown = function(e) {
            var key = e.which || e.keyCode;
            if (key == 9) e.preventDefault();
            // code for tab is 9
        }
    }
</script>

Upvotes: 6

Joseph Silber
Joseph Silber

Reputation: 220136

var el = document.getElementById('input_message');

el.focus();

el.onblur = function () {
    setTimeout(function () {
        el.focus();
    });
};

Here's the fiddle: http://jsfiddle.net/MwaNM/

Upvotes: 10

Related Questions