jquery复选框选择特效修改,复选框打勾隐藏取消则显示 代码修改 以下代码是通过INPUT ID控制 这样会导致 5
提交的内容不是通一个表单,可否统一input表单ID下通过CLASS来处理代码如下:span{list-style:none;}.pricep{color:#C90;}#...
提交的内容不是通一个表单,可否统一input 表单ID下 通过CLASS来处理
代码如下:
span{list-style:none;}
.price p{ color:#C90;}
#Checked_t1{width:920px; height:auto; color:#000; overflow:hidden;}
#Checked_t1 li{ width:120px; padding:2px; height:auto; overflow:hidden; float:left;list-style:none;display:none;}
#Checked_t1 li a{ color:#000;}
#Checked_t1 li img{ width:120px; height:120px;}
</style>
<script src="jquery-1.9.0.js" language="javascript"></script>
<script>
$().ready(function(){
$("#Checked_t1").html($("#Checked_t1").html()+$(".ul-t1").html());
$(".ul-t1 input").click(function(){
var index=this.id.substring(7,this.id.length);
if($("#checked_t1").html()>9){
alert("已达最大限额");
$(".ul-t1 #subform"+index).removeAttr("checked");
return;
}
$(".ul-t1 #subform"+index).removeAttr("checked");
$("#Checked_t1 #li"+index).show();
$(".ul-t1 #li"+index).hide();
$("#checked_t1").html($("#checked_t1").html()-(-1));
check();
});
$("#Checked_t1 input").click(function(){
var index=this.id.substring(7,this.id.length);
$(".ul-t1 #li"+index).show();
$("#Checked_t1 #li"+index).hide();
$("#checked_t1").html($("#checked_t1").html()-1);
});
function check(){
var lis=$("#Checked_t1 input");
for(var i=0;i<lis.length;i++){
//$("#Checked_t1 #subform"+i).attr("checked","checked");
//document.getElementById("Checked subform"+i).checked=true;
document.getElementById("Checked_t1").getElementsByTagName("input")[i].checked=true;
}
}
})
</script>
<div>可以选择<span id="cancheckk"></span>(几件商品)。:::已 选择<span id="checked_t1">0</span>(件商品)</div>
<ul class="ul_bk ul-t1">
<li id="li1"> <a href="http://auction1.paipai.com/4B13961300000000040100001E627C19" target="_blank" title="纯棉袜子"><img src="http://img3.paipaiimg.com/1cb682b8/item-50D98723-4B13961300000000040100001E627C19.0.jpg" class="pic" alt="纯棉袜子" height="160" width="160"></a>
<h4 class="li_title"><a href="http://auction1.paipai.com/4B13961300000000040100001E627C19" target="_blank" title="纯棉袜子">纯棉袜子</a></h4>
<div class="binfo">
<p class="price">¥
5</p>
</div>
<div class="promoting">
<input id="subform1" class="subform1" name="shop[]" value="" type="checkbox" >
选择 </div>
</li> 展开
代码如下:
span{list-style:none;}
.price p{ color:#C90;}
#Checked_t1{width:920px; height:auto; color:#000; overflow:hidden;}
#Checked_t1 li{ width:120px; padding:2px; height:auto; overflow:hidden; float:left;list-style:none;display:none;}
#Checked_t1 li a{ color:#000;}
#Checked_t1 li img{ width:120px; height:120px;}
</style>
<script src="jquery-1.9.0.js" language="javascript"></script>
<script>
$().ready(function(){
$("#Checked_t1").html($("#Checked_t1").html()+$(".ul-t1").html());
$(".ul-t1 input").click(function(){
var index=this.id.substring(7,this.id.length);
if($("#checked_t1").html()>9){
alert("已达最大限额");
$(".ul-t1 #subform"+index).removeAttr("checked");
return;
}
$(".ul-t1 #subform"+index).removeAttr("checked");
$("#Checked_t1 #li"+index).show();
$(".ul-t1 #li"+index).hide();
$("#checked_t1").html($("#checked_t1").html()-(-1));
check();
});
$("#Checked_t1 input").click(function(){
var index=this.id.substring(7,this.id.length);
$(".ul-t1 #li"+index).show();
$("#Checked_t1 #li"+index).hide();
$("#checked_t1").html($("#checked_t1").html()-1);
});
function check(){
var lis=$("#Checked_t1 input");
for(var i=0;i<lis.length;i++){
//$("#Checked_t1 #subform"+i).attr("checked","checked");
//document.getElementById("Checked subform"+i).checked=true;
document.getElementById("Checked_t1").getElementsByTagName("input")[i].checked=true;
}
}
})
</script>
<div>可以选择<span id="cancheckk"></span>(几件商品)。:::已 选择<span id="checked_t1">0</span>(件商品)</div>
<ul class="ul_bk ul-t1">
<li id="li1"> <a href="http://auction1.paipai.com/4B13961300000000040100001E627C19" target="_blank" title="纯棉袜子"><img src="http://img3.paipaiimg.com/1cb682b8/item-50D98723-4B13961300000000040100001E627C19.0.jpg" class="pic" alt="纯棉袜子" height="160" width="160"></a>
<h4 class="li_title"><a href="http://auction1.paipai.com/4B13961300000000040100001E627C19" target="_blank" title="纯棉袜子">纯棉袜子</a></h4>
<div class="binfo">
<p class="price">¥
5</p>
</div>
<div class="promoting">
<input id="subform1" class="subform1" name="shop[]" value="" type="checkbox" >
选择 </div>
</li> 展开
展开全部
你在选择的时候就可以用class来选择
$("input[class='subform1']") // 选择所有class='subform1'的input
$("input[class='subform1']") // 选择所有class='subform1'的input
更多追问追答
追问
这个是通过input提交过了的 subform1 后面的1来控制选择的是哪个来控制显示与隐藏
var index=this.id.substring(7,this.id.length);
这个改成或取动态的class='subform1' class='subform2' class='subform2'。。。。。该怎么改
追答
那你可以写$("input[class^='subform']")
表示class匹配以字符串subform开头的节点
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询