使*只是文本框的一部分*不可编辑

Question

我希望用户能够在我的网站上自定义他们的个人网页,其中文本框的值将是"example.com/username"但我希望"example.com/" 在文本框中但是不可编辑

Tumblr这样做但我无法弄清楚如何:http://www.tumblr.com/register

Answer 1

这是Tumblr页面中的代码.

     <input type="text" class="text_field" style="padding:0px; border-width:0px; text-align:right; width:325px; background:transparent;"
    id="tumblelog_name" name="tumblelog[name]"
                                            onfocus="$('tumblelog_name_background').style.backgroundColor = '#f9f8e4'; $('tumblelog_name_background').style.color = ''" onblur="$('tumblelog_name_background').style.backgroundColor = ''; if($('tumblelog_name').value == '') 
{ $('tumblelog_name_background').style.color = '#c1cfdd' }"/>.tumblr.com

如您所见,附加.tumblr.com内容根本不是输入文本框的一部分.它的div风格看起来就像它旁边的文本输入框.因此给它一个不可写的输入文本字段的错觉.