Andres Sweeney-Rios
Andres Sweeney-Rios

Reputation: 71

Input .value returns undefined

The value of the input entered is returned as undefined. I already saw other questions like this, but nothing worked. Anyway, when I use my jQuery it always gives me undefined.

jQuery:

$( document ).ready(function() {
$('#Input').keypress(
    function(e){
        if (e.keyCode == 13) {
            alert( ">" + $("#Input").value );
        }
    });
}); 
<!DOCTYPE html>
<html>
<style type="text/css">
body{
	background-color: black;
	color: #00c600;
	font-family: VT323;
}
input{
	background-color: black;
	color: #00c600;
	font-family: VT323;
	border:none;
	width: 98%%;
	height: 30px;
	font-size: 20px;
	border: 2px black;
	float: left;
	margin-left: 10px;
	list-style-type: none;
	position: absolute; 
	bottom: 17px;
}

input:focus {
    outline: 0;
}
h1{
	text-align: center;
	font-size: 50px;
}
h2{
	padding-left: 20px;
}
::-webkit-input-placeholder {
   color: #00c600;
}
::-webkit-scrollbar { 
    display: none; 
}
</style>

<body>
	<script src="http://code.jquery.com/jquery-1.3.2.min.js">
	</script>
<script src="jquery.js">
</script>

<link href='http://fonts.googleapis.com/css?family=VT323' rel='stylesheet' type='text/css'>
<h1>FUN TIME BETA 0.1 </h1>

<div id="Text" style="overflow:auto; width:100%; height:400px;">
<h2>>Welcome to Fun Time</h2>
<h2>>Press F11 to enter full screen</h2>

</div>

<h3 style="float:left;list-style-type: none; position: absolute; bottom: 5px;">></h3> 

<input name="Input" id="Input" type="text" autofocus> </input>
</body>
</html>

When I alert, undefined. Console log, undefined. Append, gives back an error(the error is irrelevant). I tried changing up the code many times.

Upvotes: 0

Views: 6973

Answers (2)

Satpal
Satpal

Reputation: 133403

value is a property of native DOM element and $('#Input') is a jQuery object and they don't have the value property thus the error.

Since you are executing the code in the event handler, Either this.value or $(this).val() can be used.

Upvotes: 5

Nikhil Aggarwal
Nikhil Aggarwal

Reputation: 28455

You need to update your code from

$("#Input").value

to

$("#Input").val()

Upvotes: 2

Related Questions