对于作为防守队员.player--defenseman
的曲棍球运动员,多次点击"Add to Team"
按钮btn-add
会在每次点击后替换一个跨栏的文字,但不应添加该玩家的名字不止一次。
spanText !== playerName
来比较两个字符串,但是当我console.log
字符串时,我得到的是默认文本"Pick a defenseman"
,然后是该播放器的名字,尽管该球员被选中并且他的名字已经在跨越spanText
或eq(0)
,尤其是涉及防御员的部分function countPlayers(){
$(".player").click(function(){
// Select the current player
var player = $(this);
// Count number of players of each position that have been clicked
var pickedF = $(".player--forward.is-selected").length;
var pickedD = $(".player--defenseman.is-selected").length;
var pickedG = $(".player--goalie.is-selected").length;
// Grab the name of the player last clicked
playerName = player.find(".player__name").text();
// Literally magic.
$(".btn--add").unbind("click");
$(".btn--add").click(function(){
// Ensures names don't match
var spanText = $(".player__pick").eq(0).text();
// Changes the opacity of a picked player to 0.5
player.addClass("is-selected");
if (player.hasClass("player--forward")) {
if (spanText !== playerName) {
$(".player__pick--forward.is-empty").eq(0).html(playerName);
$(".player__pick--forward.is-empty").eq(0).removeClass("is-empty");
if (pickedF < 2) {
pickedF++;
}
if (pickedF === 2) {
$(".player--forward").not(":has(.is-selected)").css("pointer-events", "none");
console.log("Locked forwards");
} else {
$(".player--forward").css("pointer-events", "auto");
}
}
}
// Something is wonky here
if (player.hasClass("player--defenseman")) {
if (spanText !== playerName) {
$(".player__pick--defenseman.is-empty").eq(0).html(playerName);
$(".player__pick--defenseman.is-empty").eq(0).removeClass("is-empty");
console.log(spanText);
console.log(playerName);
if (pickedD < 3) {
pickedD++;
}
if (pickedD === 3) {
$(".player--defenseman").not(":has(.is-selected)").css("pointer-events", "none");
console.log("Locked defensemen");
} else {
$(".player--defenseman").css("pointer-events", "auto");
}
}
}
if (player.hasClass("player--goalie")) {
if (spanText !== playerName) {
$(".player__pick--goalie.is-empty").eq(0).html(playerName);
$(".player__pick--goalie.is-empty").eq(0).removeClass("is-empty");
if (pickedG < 1){
pickedG++;
}
if (pickedG === 1) {
$(".player--goalie").not(":has(.is-selected)").css("pointer-events", "none");
console.log("Locked goalie");
} else {
$(".player--goalie").css("pointer-events", "auto");
}
}
}
console.log(pickedF, pickedD, pickedG);
});
$(".btn--remove").click(function(){
player.removeClass("is-selected");
if (player.hasClass("player--forward")) {
$(".player__pick--forward").eq(0).html("Pick a Forward");
$(".player__pick--forward").eq(0).addClass("is-empty");
if (pickedF > 0 && pickedF < 2) {
pickedF--;
}
}
if (player.hasClass("player--defenseman")) {
$(".player__pick--defenseman").eq(0).html("Pick a Defenseman");
$(".player__pick--defenseman").eq(0).addClass("is-empty");
if (pickedD > 0 && pickedD < 3){
pickedD--;
}
}
if (player.hasClass("player--goalie")) {
$(".player__pick--goalie").eq(0).html("Pick a Goalie");
$(".player__pick--goalie").eq(0).addClass("is-empty");
if (pickedG > 0){
pickedG--;
}
}
console.log(pickedF, pickedD, pickedG);
});
});
}
<div class="player player--plante player--goalie" data-id="30">
<div class="player__info animated">
<p class="player__name">Jacques Plante</p>
<p class="player__position">Goalie</p>
</div>
</div>
<div class="player player--brown player--defenseman" data-id="31">
<div class="player__info animated">
<p class="player__name">Jeff Brown</p>
<p class="player__position">Defenseman</p>
</div>
</div>
<div class="player player--roberts player--defenseman" data-id="32">
<div class="player__info animated">
<p class="player__name">Jimmy Roberts</p>
<p class="player__position">Defenseman</p>
</div>
</div>
<div class="player player--mullen player--forward" data-id="33">
<div class="player__info animated">
<p class="player__name">Joe Mullen</p>
<p class="player__position">Forward</p>
</div>
</div>
<ul>
<li><span class="player__pick player__pick--forward is-empty"><i class="fa fa-long-arrow-right" aria-hidden="true"></i> Pick a forward</span></li>
<li><span class="player__pick player__pick--forward is-empty"><i class="fa fa-long-arrow-right" aria-hidden="true"></i> Pick a forward</span></li>
<li><span class="player__pick player__pick--defenseman is-empty"><i class="fa fa-long-arrow-right" aria-hidden="true"></i> Pick a defenseman</span></li>
<li><span class="player__pick player__pick--defenseman is-empty"><i class="fa fa-long-arrow-right" aria-hidden="true"></i> Pick a defenseman</span></li>
<li><span class="player__pick player__pick--defenseman is-empty"><i class="fa fa-long-arrow-right" aria-hidden="true"></i> Pick a defenseman</span></li>
<li><span class="player__pick player__pick--goalie is-empty"><i class="fa fa-long-arrow-right" aria-hidden="true"></i> Pick a goalie</span></li>
</ul>
btn--add
<div class="popup clearfix">
<div class="icon-container">
<i class="fa fa-times" aria-hidden="true"></i>
</div>
<img src="" alt="" class="popup__picture animated">
<div class="popup__text">
<p class="popup__position">tk-position</p>
<p class="popup__name">tk-name</p>
<p class="popup__years">tk-years</p>
<p class="popup__description">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sequi ad dicta sunt unde, sed quae nihil inventore voluptates nulla voluptate laudantium nesciunt quo, aspernatur deleniti quod harum, nisi error doloribus.</p>
<div class="popup__stats">
<p>tk-stats</p>
</div>
<div class="buttons">
<button class="btn--add">Add to team</button>
<button class="btn--remove">Remove from team</button>
</div>
</div>
</div>
答案 0 :(得分:-1)
尝试使用!=来比较字符串内容。