Working on a simple issue here. In the end the project will take a user's submitted name and capitalize the first two letters.
However for now I'm just trying to store the user's input in a variable and then display the exact same thing in a "results" form. Not sure where I'm going wrong.
JSFiddle: /
HTML:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"
src=".3.0/jquery.min.js">
</script>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<script src="application.js"></script>
<title>Tim's Name Capitalizer!</title>
</head>
<body>
<h2>Name Capitalizer</h2>
<div class="intro">
Wele! Enter your name below (first and last) then press "SUBMIT" to see
what happen!
<br>
</div>
<br>
<form>
Enter Here:
<br>
<input type="text" name="name" id="enteredFormName" placeholder="Your
Name">
</form>
<br>
<form>
Result:
<br>
<input type="text" name="fixName" id="fixedFormName" placeholder="Your
Name">
</form>
<br>
<button>Submit</button>
</body>
</html>
CSS:
div.intro{
font-weight: bold;
width: 50%;
}
form.questions{
text-align: left;
font-size: 25px;
width: 500px;
height: 100px;
border: 1px solid black;
padding: 5px;
}
JS:
$(document).ready(function(){
//when the <submit> button is clicked
$('button').click(function(){
//store the user's entry in a variable
var enteredName = document.getElementById('enteredFormName').value;
//update the html in the second form to show the user's entered name
$('#fixedFormName').value(enteredName);
});
}
Working on a simple issue here. In the end the project will take a user's submitted name and capitalize the first two letters.
However for now I'm just trying to store the user's input in a variable and then display the exact same thing in a "results" form. Not sure where I'm going wrong.
JSFiddle: http://jsfiddle/Ever/DQn57/
HTML:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"
src="http://ajax.googleapis./ajax/libs/jquery/1.3.0/jquery.min.js">
</script>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<script src="application.js"></script>
<title>Tim's Name Capitalizer!</title>
</head>
<body>
<h2>Name Capitalizer</h2>
<div class="intro">
Wele! Enter your name below (first and last) then press "SUBMIT" to see
what happen!
<br>
</div>
<br>
<form>
Enter Here:
<br>
<input type="text" name="name" id="enteredFormName" placeholder="Your
Name">
</form>
<br>
<form>
Result:
<br>
<input type="text" name="fixName" id="fixedFormName" placeholder="Your
Name">
</form>
<br>
<button>Submit</button>
</body>
</html>
CSS:
div.intro{
font-weight: bold;
width: 50%;
}
form.questions{
text-align: left;
font-size: 25px;
width: 500px;
height: 100px;
border: 1px solid black;
padding: 5px;
}
JS:
$(document).ready(function(){
//when the <submit> button is clicked
$('button').click(function(){
//store the user's entry in a variable
var enteredName = document.getElementById('enteredFormName').value;
//update the html in the second form to show the user's entered name
$('#fixedFormName').value(enteredName);
});
}
5 Answers
Reset to default 3http://jsfiddle/dwebexperts/U68ny/2/
Replace this:
$(document).ready(function(){
//when the <submit> button is clicked
$('button').click(function(){
//store the user's entry in a variable
var enteredName = document.getElementById('enteredFormName').value;
//update the html in the second form to show the user's entered name
$('#fixedFormName').value(enteredName);
});
}
with this:-
$(document).ready(function(){
//when the <submit> button is clicked
$('button').click(function(){
//store the user's entry in a variable
var enteredName = document.getElementById('enteredFormName').value;
//OR var enteredName = $('#enteredFormName').val();
//update the html in the second form to show the user's entered name
$('#fixedFormName').val(enteredName);
});
});
You also have an issue at the closing of " $(document).ready(function(){ ", you are closing it with } this only whereas, it requires }); at the end.
why are you mixing normal js with jquery ?
var enteredName = $('#enteredFormName').val();
$('#fixedFormName').val(enteredName);
Just try this
$(function(){
$("button").click(function(){
var data = $("#enteredFormName").val();
$("#fixedFormName").val(data);
});
})
Use the jQuery my friend.
$(document).ready(function(){
//when the <submit> button is clicked
$( "button" ).click(function() {
//store the user's entry in a variable
var enteredName = $('#enteredFormName').val();
//update the html in the second form to show the user's entered name
$('#fixedFormName').val(enteredName);
});
});
Try this :
Jquery :
$(document).ready(function(){
$('#button').click(function(){
var enteredName = document.getElementById('enteredFormName').value.toUpperCase();
$('#fixedFormName').val(enteredName)
});
});
Demo :
http://jsfiddle/C9gGq/
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1744760536a4592149.html
评论列表（0条）