<html>
<head>
<title>example</title>
<link
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="stylesheet" type="text/css" />
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"
type="text/javascript"></script>
<script
src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"
type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#myInputText').keyup(function() {
$('#myOutputText').val($(this).val());
$('#myDIVTag').html('<b>' + $(this).val() + '</b>');
});
});
</script>
</head>
<body>
<form id="myForm" action="">
<fieldset>
<legend>jQuery Get and Set input Text value</legend>
<p>
<label for="myInputText">
Type something here:
</label>
<input
id="myInputText" type="text" name="inputBox" />
</p>
<p>
<label for="myOutputText">
See Result in this Text Box:
</label>
<input
id="myOutputText" type="text" name="outputBox"
readonly="readonly" />
</p>
<p>
See Result in this DIV section:
</p>
<div id="myDIVTag"></div>
</fieldset>
</form>
</div>
</body>
</html>
Demo:
<head>
<title>example</title>
<link
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="stylesheet" type="text/css" />
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"
type="text/javascript"></script>
<script
src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"
type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#myInputText').keyup(function() {
$('#myOutputText').val($(this).val());
$('#myDIVTag').html('<b>' + $(this).val() + '</b>');
});
});
</script>
</head>
<body>
<form id="myForm" action="">
<fieldset>
<legend>jQuery Get and Set input Text value</legend>
<p>
<label for="myInputText">
Type something here:
</label>
<input
id="myInputText" type="text" name="inputBox" />
</p>
<p>
<label for="myOutputText">
See Result in this Text Box:
</label>
<input
id="myOutputText" type="text" name="outputBox"
readonly="readonly" />
</p>
<p>
See Result in this DIV section:
</p>
<div id="myDIVTag"></div>
</fieldset>
</form>
</div>
</body>
</html>
Demo:
No comments:
Post a Comment