开发者

Put text in textbox

开发者 https://www.devze.com 2023-03-17 23:30 出处:网络
Is there a way to put text in a textbox but also allow the user to type something.I would like to write \"username:\" inside the box and allow the user to type after the colon.I can do this the hard w

Is there a way to put text in a textbox but also allow the user to type something. I would like to write "username:" inside the box and allow the user to type after the colon. I can do this the hard way by creating a div right next to a textbox and make it look like they are one container, but I was wondering if there was an easier way? Thanks

EDIT: I don't want to text to disappear. I just want to user to be able to continue开发者_JS百科 typing

EDIT 2: the reason you cant put a value in the textbox is because its a form. when the user types a username next to the value it will submit together


HTML5 has a placeholder attribute you can now use:

<input type="text" placeholder="username" />

People have also created javascript functions that mimic this functionality.

There's also a jQuery placeholder plugin which does the same, if you'd like to go that route.


What's wrong with using standard HTML? You don't say that you need it to disappear...

<input type="text" value="username: " />

If you need it to disappear, use a placeholder attribute and a jQuery plugin as a fallback (for the browsers that don't support it.


You could do something like this:

<div>
    <label>Username:</label>
    <input type="text" />
</div>

CSS

div{border:1px solid gray;}
label{font-family:arial; font-size:.8em;}
input{border:none;}
input:focus{outline:none;}

Basically, created a containing div and placed a label and input in that div. label is the words that stay in the field. input has the border removed.

http://jsfiddle.net/jasongennaro/rZmFx/

Fyi... you may need to increase the size of the input, depending on how many characters you want to accept.


<input type="text" placeholder="Category"/>

Maybe that can help you. If you want the textbox for only read you can put the property readonly = "".


You could call this javascript function once the page is loaded:

function add(text){
    var TheTextBox = document.getElementById("Mytextbox");
    TheTextBox.value = TheTextBox.value + text;
}


If you are using HTML5, you can use the placeholder attribute.

http://www.w3schools.com/html5/att_input_placeholder.asp

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号