Как сделать в input text чтобы нельзя было менять часть текста?

Question

[Узаир Ижа]

Хочу на картинке. То есть vk.com его не возможно изменить.

Answer 1

[L0k1]

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

Comments

[Михаил]

Пример бы привели (на codepenio, js fiddle etc.)

[L0k1]

я не думал, что для такой ерунды нужен пример jsfiddle.net/unmxf9k6

[Узаир Ижа]

L0k1: Почему код может не работать?

Answer 2

[Владимир]

Немного доработал решение Дениса, чтобы не затирался текст при попытке ввести в "неизменяемом" месте
jsfiddle.net/shvr9afd/1

Answer 3

[Денис Инешин]

Ну например так: jsfiddle.net/shvr9afd

var $inp = $(".test"),
    reference = "Эй ты! А ну иди сюда! ";

function change (val) {
    var ind = val.indexOf(reference);
    
    if (ind !== 0) {
        $inp.prop("value", reference);
    }
}

$inp.on("input", function () {
    var val = $(this).prop("value");
    change(val);
});

Comments

[Узаир Ижа]

а value меняется ну когда я добавляю свое?

[Денис Инешин]

Узаир Ижа: конечно.

[Узаир Ижа]

Денис Инешин: спасибо