Below is a small sample that i tried. This is not the exact solution but it might be useful. There are several things you might have to take care
- when user enters characters
- when user selects the whole text and enters
- when the user presses backspace (select all and delete)
etc. ..
<html>
<head>
<title></title>
</head>
<body>
<textarea id="txtArea" class="TextArea" name="textarea" maxlength="256"></textarea>
<input type="button" value="Get Value" />
<script type="text/javascript" src="../Scripts/jquery-1.7.1.js"></script>
<script type="text/javascript">
$(function ($) {
var text;
$('#txtArea').keyup(function (e) {
if (text) {
text += $(this).val().replace(stars.substring(0, stars.length - 1), "");
} else {
text = $(this).val().replace(stars.substring(0, stars.length - 1), "");
}
ShowCharacter();
});
var stars;
$('#txtArea').keydown(function () {
if (stars)
stars += '*';
else
stars = '*'
});
function ShowCharacter() {
$('#txtArea').val(stars)
}
$("input[type='button']").click(function () {
alert(text);
});
});
</script>
</body>
</html>