need help in creating textarea
hi
I am trying to create a textarea. There is a default text inside textarea. so when user clicks inside textarea then submit button appears and default text disappears and when user clicks somewhere else or outside textarea then it gets back to original state i.e, default text appears back and submit button disappears.
here is what i did sofar. in this code when i click inside textarea then submit button does appear but text does not erase and when i click outside then button remains in sight.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
#submit {
visibility: hidden;
}
</style>
</head>
<body>
<form>
<label>Message:</label>
<textarea name="message" id="message" rows="5" cols="30">write message here!</textarea><br />
<input type="button" name="submit" id="submit" value="submit" />
</form>
</body>
<script type="text/javascript" src="lib/jquery-1.4.min(Production).js"></script>
<script>
var flag = false;
$(document).ready(function () {
$('#message').click(function () {
flag = true;
$('#submit').css('visibility','visible');
if(flag == true) {
//alert(flag);
var msg = $('#message').val();
//alert(msg);
msg = "";
//alert(msg);
}
});
});
</script>
</html>