我不习惯在jquery中编写一些代码但是很努力。
制作投票应用程序,我想在用户点击页面中的两个按钮之一时向用户显示不同的背景。
div tag
<div id="soruBtnSol" class="bgsol">
<!-- solbuttonbg -->
<a class="sorubtn<?=$i?>1" href="javascript:;" rel="<?=$i?>">
<span id="userCevap" class="sorubtnTxtSol">
<em class="<?php echo $soruCevapId[0]; ?>" style="visibility:visible">
<?=$question[0]?>
</em>
</span>
</a>
</div>
jquery的
$('#soruBtnSol').on('click', function(e){ // FORM GONDER BUTTON EVENT
var grupid = 'groupId='+$("#groupIdd").attr('class');
var cevapid = 'cevapId='+$("#cevapIdd").attr('class');
var usercevapid = 'userCevap='+$("#userCevap").find('em').attr('class');
console.log(grupid); //example : 45
console.log(cevapid);
console.log(usercevapid);
if(cevapid != usercevapid) {
$( "#soruBtnSol" ).removeClass( "bgsol" ).addClass( "fail" );
}
if(cevapid == usercevapid) {
$( "#soruBtnSol" ).removeClass( "bgsol" ).addClass( "success" );
currentskor = 5;
}
});
编辑:CSS ADDED
#soruBtnSol {
position: absolute;
top: 50%;
left: 80px;
width: 192px;
height: 75px;
margin-left: -75px;
z-index: 3;
float: left;
}
.bgsol {
background: url("../img/btn-left.png") no-repeat;
}
.fail {
position: absolute;
background: url("../img/fail.png") no-repeat;
z-index: 4;
}
.success {
position: absolute;
background: url("../img/success.png") no-repeat;
z-index: 4;
}
如果用户给出了错误答案,我想将<div id="soruBtnSol" class="bgsol">
更改为<div id="soruBtnSol" class="fail">
。如果没有,类将成功。
我在jquery中的 if()条件中可能会遇到一些问题。
有什么建议吗?
答案 0 :(得分:0)
试试这个
$('#soruBtnSol').on('click', function(e){ // FORM GONDER BUTTON EVENT
var grupid = 'groupId='+$("#groupIdd").prop('class');
var cevapid = 'cevapId='+$("#cevapIdd").prop('class');
var usercevapid = 'userCevap='+$("#userCevap").find('em').attr('class');
console.log(grupid); //example : 45
console.log(cevapid);
console.log(usercevapid);
if(cevapid != usercevapid) {
$(this).removeClass("bgsol").addClass("fail");
}
if(cevapid == usercevapid) {
$(this).removeClass("bgsol").addClass("success");
currentskor = 5;
}
});