多个输入框带数字个数
<!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![]()
ml; charset=utf-8" />
<title>评论模块</title>
</head>
<body>
<div class="divRemark">
<div class="divInput" ><input onfocus="input_onfocus(this,200)" style="color:#F9C" readonly="readonly" value="我也说一句.." /></div>
<div class="divTextArea" style="display:none">
<textarea onblur="textarea_onblur(this)" onfocus="checkInputedCommentLegal(this,200)"></textarea>
<br />
<div class="divInfo">
<span >0/200</span>
<a href="javascript:void(0);" onclick="onSubmit(this)">提交</a>
</div>
</div>
</div>
<div class="divRemark">
<div class="divInput" ><input onfocus="input_onfocus(this,200)" style="color:#F9C" readonly="readonly" value="我也说一句.." /></div>
<div class="divTextArea" style="display:none">
<textarea onblur="textarea_onblur(this)" onfocus="checkInputedCommentLegal(this,200)"></textarea>
<br />
<div class="divInfo">
<span >0/200</span>
<a href="javascript:void(0);" onclick="onSubmit(this)">提交</a>
</div>
</div>
</div>
<div class="divRemark">
<div class="divInput" ><input onfocus="input_onfocus(this,200)" style="color:#F9C" readonly="readonly" value="我也说一句.." /></div>
<div class="divTextArea" style="display:none">
<textarea onblur="textarea_onblur(this)" onfocus="checkInputedCommentLegal(this,200)"></textarea>
<br />
<div class="divInfo">
<span >0/200</span>
<a href="javascript:void(0);" onclick="onSubmit(this)">提交</a>
</div>
</div>
</div>
<script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script language="javascript">
/*
*函数名：input_onfocus
*功能：当inputObj获得焦点时，显示textarea评论输入框
*参数:inputObj-input对象（用于显示“我也说一句..”）,maxLength-允许输入最大长度
*返回值：void
*/
function input_onfocus(inputObj,maxLength)
{
//显示textarea，隐藏input
$(inputObj).parent(".divInput").parent(".divRemark")
.find(".divTextArea").show().find("textarea").focus();
$(inputObj).parent(".divInput").parent(".divRemark").find(".divInput").hide();
//设置字数统计标签
var content_len = $(inputObj).parent(".divInput").parent(".divRemark")
.find(".divTextArea").find("textarea").val().length;
var labelSpan = $(inputObj).parent("div.divInput").parent("div.divRemark").find(".divTextArea").find("div.divInfo").find('span');
if (!labelSpan)
{
alert("null object");
return false;
}
//设置标签值
labelSpan.html(content_len+'/' + maxLength );
//设置字体颜色
if( content_len <= maxLength )
{
//输入合法
labelSpan.css("color","#000000");
}
else
{
//输入超限
labelSpan.css("color","#ff0000");
}
}
/*
*函数名：textarea_onblur
*功能：当textarea失去焦点时，如果内容为空显示input（“我也说一句”）
*参数:textareaObj-textarea对象
*返回值：void
*/
function textarea_onblur(textareaObj)
{
if($(textareaObj).val() == "" )
{
//显示input，隐藏textarea
$(textareaObj).parent(".divTextArea").hide();
$(textareaObj).parent(".divTextArea").parent(".divRemark")
.find(".divInput").show();
}
}
/*
*函数名：checkInputedCommentLegal
*功能：检查输入评论字符，如果字符输入大于maxLength统计字符变红
*参数:obj-textarea对象,maxLength-允许最大输入长度
*返回值:true-执行成功，false-执行失败
*/
function checkInputedCommentLegal(obj,maxLength)
{
$(obj).bind('focus keyup keydown',function()
{
var content_len = $(this).val().length;
var labelSpan = $(this).parent("div.divTextArea").find("div.divInfo")
.find('span');
if (!labelSpan)
{
alert("null object");
return false;
}
//设置标签值
labelSpan.html(content_len+'/' + maxLength );
//设置字体颜色
if( content_len <= maxLength )
{
//输入合法
labelSpan.css("color","#000000");
}
else
{
//输入超限
labelSpan.css("color","#ff0000");
}
});
return true;
}
//提交
function onSubmit(aobj)
{
//获得输入字符
var divTextArea = $(aobj).parent(".divInfo").parent(".divTextArea");
alert( $(divTextArea).find("textarea").val() );
if(true/*这里应该为提交成功条件*/)
{
$(divTextArea).find("textarea").val("");//清除输入框信息
$(divTextArea).hide();
$(divTextArea).parent(".divRemark").find(".divInput").show();
}
}
</script>
</body>
<![]()
ml>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text
<title>评论模块</title>
</head>
<body>
<div class="divRemark">
<div class="divInput" ><input onfocus="input_onfocus(this,200)" style="color:#F9C" readonly="readonly" value="我也说一句.." /></div>
<div class="divTextArea" style="display:none">
<textarea onblur="textarea_onblur(this)" onfocus="checkInputedCommentLegal(this,200)"></textarea>
<br />
<div class="divInfo">
<span >0/200</span>
<a href="javascript:void(0);" onclick="onSubmit(this)">提交</a>
</div>
</div>
</div>
<div class="divRemark">
<div class="divInput" ><input onfocus="input_onfocus(this,200)" style="color:#F9C" readonly="readonly" value="我也说一句.." /></div>
<div class="divTextArea" style="display:none">
<textarea onblur="textarea_onblur(this)" onfocus="checkInputedCommentLegal(this,200)"></textarea>
<br />
<div class="divInfo">
<span >0/200</span>
<a href="javascript:void(0);" onclick="onSubmit(this)">提交</a>
</div>
</div>
</div>
<div class="divRemark">
<div class="divInput" ><input onfocus="input_onfocus(this,200)" style="color:#F9C" readonly="readonly" value="我也说一句.." /></div>
<div class="divTextArea" style="display:none">
<textarea onblur="textarea_onblur(this)" onfocus="checkInputedCommentLegal(this,200)"></textarea>
<br />
<div class="divInfo">
<span >0/200</span>
<a href="javascript:void(0);" onclick="onSubmit(this)">提交</a>
</div>
</div>
</div>
<script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script language="javascript">
/*
*函数名：input_onfocus
*功能：当inputObj获得焦点时，显示textarea评论输入框
*参数:inputObj-input对象（用于显示“我也说一句..”）,maxLength-允许输入最大长度
*返回值：void
*/
function input_onfocus(inputObj,maxLength)
{
//显示textarea，隐藏input
$(inputObj).parent(".divInput").parent(".divRemark")
.find(".divTextArea").show().find("textarea").focus();
$(inputObj).parent(".divInput").parent(".divRemark").find(".divInput").hide();
//设置字数统计标签
var content_len = $(inputObj).parent(".divInput").parent(".divRemark")
.find(".divTextArea").find("textarea").val().length;
var labelSpan = $(inputObj).parent("div.divInput").parent("div.divRemark").find(".divTextArea").find("div.divInfo").find('span');
if (!labelSpan)
{
alert("null object");
return false;
}
//设置标签值
labelSpan.html(content_len+'/' + maxLength );
//设置字体颜色
if( content_len <= maxLength )
{
//输入合法
labelSpan.css("color","#000000");
}
else
{
//输入超限
labelSpan.css("color","#ff0000");
}
}
/*
*函数名：textarea_onblur
*功能：当textarea失去焦点时，如果内容为空显示input（“我也说一句”）
*参数:textareaObj-textarea对象
*返回值：void
*/
function textarea_onblur(textareaObj)
{
if($(textareaObj).val() == "" )
{
//显示input，隐藏textarea
$(textareaObj).parent(".divTextArea").hide();
$(textareaObj).parent(".divTextArea").parent(".divRemark")
.find(".divInput").show();
}
}
/*
*函数名：checkInputedCommentLegal
*功能：检查输入评论字符，如果字符输入大于maxLength统计字符变红
*参数:obj-textarea对象,maxLength-允许最大输入长度
*返回值:true-执行成功，false-执行失败
*/
function checkInputedCommentLegal(obj,maxLength)
{
$(obj).bind('focus keyup keydown',function()
{
var content_len = $(this).val().length;
var labelSpan = $(this).parent("div.divTextArea").find("div.divInfo")
.find('span');
if (!labelSpan)
{
alert("null object");
return false;
}
//设置标签值
labelSpan.html(content_len+'/' + maxLength );
//设置字体颜色
if( content_len <= maxLength )
{
//输入合法
labelSpan.css("color","#000000");
}
else
{
//输入超限
labelSpan.css("color","#ff0000");
}
});
return true;
}
//提交
function onSubmit(aobj)
{
//获得输入字符
var divTextArea = $(aobj).parent(".divInfo").parent(".divTextArea");
alert( $(divTextArea).find("textarea").val() );
if(true/*这里应该为提交成功条件*/)
{
$(divTextArea).find("textarea").val("");//清除输入框信息
$(divTextArea).hide();
$(divTextArea).parent(".divRemark").find(".divInput").show();
}
}
</script>
</body>
<
