效果如圖:
jquery代碼:
//商品屬性
var $attribute=$(".attribute");
var $count=$attribute.length;
$attribute.keyup(function(){
var index=0; //這裏我不知道用什麼方法獲得當前對象的索引 就用了下面這種笨方法 【我試了 $(this).index($(".attribute")) ,可是這樣獲取的不正確~~~~(>_<)~~~~ 】
for(var i=0;i<$count;i++){
var $temp=$attribute.eq(i);
if($temp.attr("name")==$(this).attr("name")){
index=i;
break;
}
}
var $this = $(this);
var currCount = getLength($this.val());
checkAttributeLength(currCount,index);
});
$attribute.blur(function(){
var index=0;
for(var i=0;i<$count;i++){
var $temp=$attribute.eq(i);
if($temp.attr("name")==$(this).attr("name")){
index=i;
break;
}
}
var $this = $(this);
var currCount = getLength($this.val());
checkAttributeLength(currCount,index);
});
function checkAttributeLength(count,i){
var $countTip=$(".countTipAttr");
var $nameCount=$(".nameCountAttr");
if(count <= 30){
$countTip.eq(i).html("還可以輸入");
$nameCount.eq(i).removeClass("cred").addClass("cgreen");
$nameCount.eq(i).html(30 - count);
}else{
$countTip.eq(i).html("已超出");
$nameCount.eq(i).removeClass("cgreen").addClass("cred");
$nameCount.eq(i).html(count - 30);
}
}
<#if list.attributeType == "text">
<input style="float:left;" type="text" name="${list.id}" class="attribute" value="${(product.productAttributeMap.get(list)[0])!}" /> 這裏是動態創建商品屬性文本框的【可能有多個】
<span class="text9" style="float:left;"> * </span>
<span class="countTipAttr" style="float:left;">還可以輸入</span><span style="float:left;" class="nameCountAttr" class="cgreen">30</span>個字
</#if>
我之前試過循環獲取input,然後添加keyup和blur事件,我是這樣寫的
//商品屬性
var $attribute=$(".attribute");
var $count=$attribute.length;
for(var i=0;i<$count;i++){
$attributetemp=$attribute.eq(i);//我感覺是這裏出錯,我本來想拼接名稱的【 $attributetemp0 $attributetemp1 $attributetemp2 (我是這樣拼接的: $("attributetemp"+i) )】,但是還是不行,不知道是不是拼接錯了
$attributetemp.keyup(function(){
var $this = $(this);
var currCount = getLength($this.val());
checkAttributeLength(currCount,i);
});
$attributetemp.blur(function(){
var $this = $(this);
var currCount = getLength($this.val());
checkAttributeLength(currCount,i);
});
}
但是沒有成功,具體原因我也不清楚,看到的,知道的,麻煩給我說一下哈O(∩_∩)O~