Jquery监听 textarea根据内容改变样式
问题
判断两个文本框中的日期是否一致,如不一致赋予颜色给予提示
解决思路
监听一个文本库提取内容,并根据正则提取日期与另一个文本框内容进行比较
如果不一致根据class改变文本框属性背景颜色
如图:
html部分
代码如下:
<div class="ta-wrap"><textarea cols="30" rows="10" placeholder="输入文字测试"></textarea>
</div>
scrip部分
重点 要区分监听事件
监听textarea要用(作者使用的是该监听事件)
$(".ta-wrap textarea").on('keyup', function(event){
}
监听input要用
$("input[type='text']").bind('input propertychange',function(){
}
<script>
//根据 class 找到div中的 textarea
$(".ta-wrap textarea").on('keyup', function(event) {
var a = $(this).val();
var b = $(".guyong").val();
var result1 = a.match("[0-9]{4}([\-/ \.])[0-9]{2}[\-/ \.][0-9]{4}[\-/ \.][0-9]{2}");
var result2 = b.match("[0-9]{4}([\-/ \.])[0-9]{2}[\-/ \.][0-9]{4}[\-/ \.][0-9]{2}");
if(result1!=null){
if(result1[0]!=result2[0])
{
var e=window.event;
var obj=e.srcElement;
obj.style.background="#FF7171";
$(".guyong").css("background","#FF7171");
}
else{
var e=window.event;
var obj=e.srcElement;
obj.style.background="";
$(".guyong").css("background","");
}
}else{
var e=window.event;
var obj=e.srcElement;
obj.style.background="#FF7171";
$(".guyong").css("background","");
}
});
</script>