Question

I would like to make an HTML text input field that always shows its contents quoted. I want the visitors to see the quotes but not be able to remove them. So far as I know, this can’t be done with HTML, so I threw the javascript tag in there.

To reiterate, I want there to always be one pair of quotes at the beginning of the text input field, and one at the end. Inside the text field, though, of course.

edit: Also, I would want them only to be able to type between the quotes.

Answer 1

Try the following. Its a bit weird, but it works.

Live Demo

input.onkeyup = function(){
    var chars = this.value.split('');

    // Removes any quotes that are in the string after the first one
    for(var i=1;i< chars.length; i++){
        if(chars[i] == '"'){
            chars.splice(i,1);   
        }
    }

    // Adds a quote to the end
    chars.push('"');

    // adds a quote to the beginning
    if(chars[0] != '"'){
       chars.unshift('"');
    }


    this.value = chars.join('');
}