要求:一个input输入内容的时候另外一个input框里的内容做相应的操作,复制/转化
html结构
<div class="form-group">
<input type="text" class="form-control aaa" id="" name="name" placeholder="标题">
<p data-len="70" class="limited">建议字数<b>0</b>/70</p>
</div>
<div class="form-group">
<input type="text" class="form-control link" id="" name="link" placeholder="">
</div>
js
function siteVail(){
$(".aaa").keyup(function(){
var sParent = $(this).parents("li");
var rex = ($(this).val().toLowerCase())
.replace(/\s+/g, '-')
.replace(/[^\w\-]+/g, '')
.replace(/\-\-+/g, '-')
.replace(/^-+/, '')
.replace(/-+$/, '');
sParent.find(".link").val(rex);
sParent.find("p b").text($(this).val().length);
limitLen($(this),"p","p b");//限制字数并即时提醒
})
}
function limitLen(_this,_p,_b){
var sParent = _this.parents("li");
var iLen = _this.val().length;
var maxLen = sParent.find(_p).attr("data-len");
if(iLen>maxLen){
sParent.find(_b).css("color","#dc3545");
} else if(iLen<=maxLen){
sParent.find(_b).css("color","#333");
}
}