¿Cómo arreglar un valor en un cuadro de texto?

Tengo un cuadro de texto para guardar la URL del usuario de Facebook.

  Facebook:      

¿Cómo puedo hacer que el valor ” http://www.facebook.com/ ” sea fijo e inmodificable?

ACTUALIZAR:

la parte $facebook debe ser editable !!

Hay dos métodos para hacer esto. Una es agregar el atributo disabled="disabled" a ella, o agregarle readonly .

Ambos funcionan de manera diferente. Lo que necesita puede estar disabled="disabled" atributo disabled="disabled" .

EDITAR

violín actualizado. Debe incluir el siguiente código jQuery:

 $(document).ready(function() { $("#inpt").val('http://www.facebook.com/$facebook'); $("#inpt").on('change', function() { var tval = $(this).val(); $(this).val('http://www.facebook.com/' + tval.substring(24)); }); }); 

También puede usar eventos de teclado, yo mismo soy un principiante en jQuery, de ahí esta pieza básica de código. 🙂 Además, actualice la etiqueta de input a esto:

  

Creo que estás pidiendo que ” http://www.facebook.com/ ” no sea editable, pero ¿puedes editar el rest de la URL?

Algo como el siguiente fragmento sería el enfoque más simple. Algunos ajustes de estilos como en el CSS a continuación lo harían más presentable.

 table { width: 500px; } .fakey { border: solid 1px; color: #ccc; font-family: sans-serif; font-size: .9em; } .fakey input { border: none; outline: none; font-family: sans-serif; font-size: .9em; width: 200px; } 
 
Facebook:
http://www.facebook.com/

Puede usar javascript para forzar que el prefijo permanezca ingresado a toda costa.

  $('input.facebookUrl').keyup(function(){ if ( ($(this).val().length > 0) && ($(this).val().substr(0,24) != 'http://www.facebook.com/') || ($(this).val() == '') ){ $(this).val('http://www.facebook.com/'); } }); 
    Facebook:      

pruébalo así

   Facebook:      

No sé si esto es lo que estás buscando, pero es lo mejor que puedo hacer.

  $("#input").keypress(function(ev){ var value = "www.facebook.com/"; var tval = this.value; var c = ev.charCode || ev.keyCode; this.selectionStart = this.selectionEnd = this.value.length; if (tval.length == value.length && c == 8){ ev.preventDefault(); } this.value = value + tval.substring(value.length); }); 

Aquí está el JSFiddle:

http://jsfiddle.net/FaxE4/104/

Una forma muy simple es usar el atributo readonly en la etiqueta HTML “input”.

disabled es otra propiedad que puede ser utilizada.

Referencias: https://www.w3schools.com/tags/tag_input.asp

Puedes intentar esto.

   Facebook: