要使用jq实现 单击按钮 改变按钮的样式，这样写对吗
$(document).ready(function(){
//获取按钮，以下都是原生js的获取方法和jq不同
var listBtn =$("#btn1");
var carBtn = $("#btn2");
listBtn.onclick.(function(){
//改变按钮的class的值
listBtn.removeClass("btn-list-off");
listBtn.addClass("btn-list-on");
carBtn.removeClass("btn-car-on");
carBtn.addClass("btn-car-off");
})
})
2015-06-28
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$("#btn1").bind('click', function() {
$("#btn1").attr("class","btn-list-on");
$("#btn2").attr("class","btn-card-off");
$("#box .con .big").attr("class","small");
$("#box .con img").attr("src","img/small.jpg");
/* Act on the event */
});
$("#btn2").bind('click', function() {
$("#btn1").attr("class","btn-list-off");
$("#btn2").attr("class","btn-card-on");
$("#box .con .small").attr("class","big");
$("#box .con img").attr("src","img/big.jpg");
/* Act on the event */
});
</script>类名稍有不同。
$(function(){
$('#btn1').on('click',function(){
$(this).removeClass('btn-list-off').addClass('btn-list-on');
$('#btn2').removeClass('btn-car-on').addClass('btn-car-off');
$('ul').find('img').attr('src',' http://img1.sycdn.imooc.com//53ab7cf4000196c000500050.jpg').parent().addClass('small')
});
$('#btn2').on('click',function(){
$(this).removeClass('btn-car-on').addClass('btn-car-off');
$('#btn1').removeClass('btn-list-off').addClass('btn-list-on');
$('ul').find('img').attr('src',' http://img1.sycdn.imooc.com//53ab7d16000159a801640236.jpg').parent().removeClass('small')
});
})
举报
