I want to make a text to show and hide inside an input box I made. I know that it's supposed to be like this:
onmouseover=this.style.display="block";
onmouseout=this.style.display="none";
I just don't know where to put it. Should I put it in the <input>?
Here is my HTML code:
<html>
<head>
<link rel="stylesheet" href="CSS.css"/>
<script src="JavaScript.js"></script>
</head>
<body onload= "load();">
<span id="imvite">Invite:</span>
<input /><br></br>
<span id="time">Time:</span>
<input /><br></br>
<span id="place">Place:</span>
<input /><br></br>
</body>
</html>
When I wrote it after the <input> the text was showing all the time, and it was not even in the textbox.
Like this:
<span id="imvite">Invite:</span>
<input /><br></br>
<span id="time">Time:</span>
<input /><br></br>
<span id="place">Place:</span>
<input onmouseover=this.style.display="block"; my text here />
How can I make a text to appear and disappear inside my textbox with those functions?
I hope I'm clear, thanks for the help.
I want to make a text to show and hide inside an input box I made. I know that it's supposed to be like this:
onmouseover=this.style.display="block";
onmouseout=this.style.display="none";
I just don't know where to put it. Should I put it in the <input>?
Here is my HTML code:
<html>
<head>
<link rel="stylesheet" href="CSS.css"/>
<script src="JavaScript.js"></script>
</head>
<body onload= "load();">
<span id="imvite">Invite:</span>
<input /><br></br>
<span id="time">Time:</span>
<input /><br></br>
<span id="place">Place:</span>
<input /><br></br>
</body>
</html>
When I wrote it after the <input> the text was showing all the time, and it was not even in the textbox.
Like this:
<span id="imvite">Invite:</span>
<input /><br></br>
<span id="time">Time:</span>
<input /><br></br>
<span id="place">Place:</span>
<input onmouseover=this.style.display="block"; my text here />
How can I make a text to appear and disappear inside my textbox with those functions?
I hope I'm clear, thanks for the help.
Share Improve this question edited Feb 2, 2017 at 16:19 krlzlx 5,82114 gold badges49 silver badges59 bronze badges asked Nov 18, 2015 at 15:33 user5533608user5533608 5-
1
Wait! How can you hover an element, if it has
display: noneset? – Teemu Commented Nov 18, 2015 at 15:36 -
Do you meaning show input value? because is not possible insert content in
inputelement – Lai32290 Commented Nov 18, 2015 at 15:36 -
<input onmouseover="this.style.display='block';">– yaakov Commented Nov 18, 2015 at 15:37 -
to show text in an input field, you need to address the
valueof the input field. – Burki Commented Nov 18, 2015 at 15:38 -
<input type="text" value="My text here" onmouseover="this.style.display='block'">– yaakov Commented Nov 18, 2015 at 15:38
3 Answers
Reset to default 1Try this:
<input
onmouseover="this.value=this.getAttribute('data-value');"
data-value="text"
onmouseout="this.value='';"
/>
Is this what you are trying to do?
Fiddle: http://jsfiddle/AtheistP3ace/8nL9gr1h/
HTML:
<input onmouseover="this.value='my text here';" onmouseout="this.value='';" />
<input
onmouseover="this.value=this.getAttribute('data-value');"
data-value="text"
onmouseout="this.value='';"
/>
Works, sort of, the problem is that when you mouse out, anything you typed is blanked and when you mouse over again, it just displays text. Another answer (which may not work if you want everything to be contained in the one HTML Document is to add a Class to you inputs and give it a :hover in a CSS file and link that file in the Head of your HTML, putting any changes to the styling in your CSS.
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1744837343a4596344.html
评论列表（0条）