w3c声明产生错误了~~怎么回事，ie8浏览器

<!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">
<body>
<textarea rows="7" cols="49" id="box" onclick="tellPoint()"></textarea>
<script language="javascript">
function tellPoint()
{
var rng = event.srcElement.createTextRange();
rng.moveToPoint(event.x,event.y);
rng.moveStart("character",-event.srcElement.value.length);
pnum.value = rng.text.length;
}
</script> <p></p> 
光标位置：<input type="text" value="0" id="pnum" size="8"/>
</body>
</html>如何使第一种工作呢？？下面这种到对的。
第一种当点击在textarea里的文字上时，没问题
当点击在textarea空白处时，报错，“未指明的错误”<html>
<body>
<textarea rows="7" cols="49" id="box" onclick="tellPoint()"></textarea>
<script language="javascript">
function tellPoint()
{
var rng = event.srcElement.createTextRange();
rng.moveToPoint(event.x,event.y);
rng.moveStart("character",-event.srcElement.value.length);
pnum.value = rng.text.length;
}
</script> <p></p> 
光标位置：<input type="text" value="0" id="pnum" size="8"/>
</body>
</html>