IT修真院·坑乎 | Java(后端),CSS(前端),JavaScript(前端),PM(产品经理),UI(交互设计),QA(测试),Android(安卓APP),iOS(苹果APP),OP(运维),Python(后端)日常在线问答学习平台

该问题已被官方收录

jquery中使用on()方法绑定click事件，在移动端无法focus

0

1

Jquery操作

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

//获取点击处索引，改变其显示样式
	$(".block").on("click", function() {
		let $stageCheck = window.sessionStorage.getItem('stages');
		//console.log("阶段" + $stageCheck);

		let $index = $(".block").index(this);

		if ($fromJournal[$index].role == "杀手" && $stageCheck == "1") {
			alert("杀手不能杀自己人!");
			window.sessionStorage.removeItem('isfocus');
		}
		else {
			//存储数据用于判断是否有点击
			window.sessionStorage.setItem('isfocus', 'true');

			//存储点击处索引
			window.sessionStorage.setItem('index', $index);

			$(this).addClass("death");
		}
		$(".block").each(function() {
			if ($(this).is(".deadBody") == false && $(this).is(":focus") == false) {
				$(this).removeClass("death");
			}
			else if ($(this).is(".deadBody") == true) {
				$(this).blur();
			}
		});
	})

该问题已被官方收录

不给初始状态具体的值

0

1

本地储存

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

var thestates;
var aaa = sessionStorage.getItem('step');
if (aaa == null){
    fsm.state = 'kill';
}else{
    fsm.state = aaa;
}
var fsm = {
    state: thestates,
    tokill: function(){
        switch(fsm.state){
            case'kill':
                //location.href = 'try.html';
                alert('杀手开始杀人');
                thestates = 'dead';
                sessionStorage.setItem('step', 'dead');
                $('#Onearrow').css('border-color', 'transparent #82af9a transparent transparent');
                $('.One').css('backgroundColor', '#82af9a');
                break;
            case'dead':
            case'speak':
            case'vote':
                alert('请按照游戏步骤进行');
                break;
        }
    },
    todead: function(){
        switch(fsm.state){
            case'dead':
                alert('发表遗言');
                //fsm.state = 'speak';
                thestates = 'speak';
                sessionStorage.setItem('step', 'speak');
                $('#Twoarrow').css('border-color', 'transparent #82af9a transparent transparent');
                $('.Two').css('backgroundColor', '#82af9a');
                break;
            case'dead':
            case'kill':
            case'vote':
                alert('请按照游戏步骤进行');
                break;
        }
    },

该问题已被官方收录

JS任务四的杀人页面，这个的从第一步开始做起的页面，那么我根据上次存储的数据

0

1

js基础

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./js4-3.css">
</head>

<body>
    <header>
        <h5>杀手杀人</h5>
        <a class="finish"></a>
    </header>
    <main>
        <div>
            <div class="box2">
                <p class="select1">杀手请睁眼，杀手请选择要杀的对象</p>
            </div>
            <span class="air"></span>
            <p>点击下方玩家头像，对被杀的玩家进行标记</p>
        </div>
        <div class="box">
                <div class="bo">
                    <div class="box1">
                        <div class="civilian"></div>
                        <Div class="number"></Div>
                    </div>
                </div>
            </div>
                <ul class="select" style="visibility: visible;">
                    <li class="icon1"></li>
                </ul>
            </Div>
        </div>
    </main>
    <footer>
        <span>确定</span>
    </footer>
    <script src="./js4-3.js"></script>
</body>

</html>

var data = JSON.parse(localStorage.getItem('PartArr'));
console.log(data);

var a = document.getElementsByClassName("box")[0];
var b = document.getElementsByTagName("main")[0];
var c = document.getElementsByClassName("civilian");
var d = document.getElementsByClassName("number");


function chan() {
    for (var i = 0; i < data.length - 1; i++) {
        var aa = a.cloneNode(true);
        b.appendChild(aa);
    }
}
chan();

for (let i = 0; i < data.length; i++) {
    c[i].innerText = data[i].breed;
    d[i].innerText= data[i].num
}

该问题已被官方收录

jqiery状态机

0

1

Ajax登陆

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

var $stage = new StateMachine({
    init: 'ready',
    transitions: [
        { name: 'step1', from: 'ready', to: 'kill' },
        { name: 'step2', from: 'kill', to: 'words' },
        { name: 'step3', from: 'words', to: 'speech' },
        { name: 'step4', from: 'speech', to: 'vote' },
        { name: 'reset', from: '*', to: 'ready' }
    ],
    methods: {
        onStep1: function() {
            $(".step:eq(0)").addClass("done");
            $(".round:eq(0)").addClass("do");
        },
        onStep2: function() {
            $(".step:eq(1)").addClass("done");
            $(".round:eq(1)").addClass("do");
        },
        onStep3: function() {
            $(".step:eq(2)").addClass("done");
            $(".round:eq(2)").addClass("do");
        },
        onStep4: function() {
            $(".step:eq(3)").addClass("done");
            $(".round:eq(3)").addClass("do");
        }
    }
});
 
$(".step:eq(0)").click(function () {
    $stage.onStep1();
    alert("进入杀人环节")
    window.location.href = "js2-6.html";
    
})

$(".step:eq(1)").click(function () {
    $stage.onStep2();
  
    
})

$(".step:eq(2)").click(function () {
    $stage.onStep3();
  
    
})

$(".step:eq(3)").click(function () {
    $stage.onStep4();
  
    
})

该问题已被官方收录

游戏进行到第二天，第一天的4个框的状态如何保存？

1

本地储存

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

var inbox = '<div \"content1\" >\n' +
   '        <span></span>\n' +
   '        <span \"day\">第'+ i + '天</span>\n' +
   '        <span \"icon\"></span>\n' +
   '    </div>\n' +
   '    <div \"hidden1\">\n' +
   '        <div \"bar\">\n' +
   '            <div \"circular-first\"></div>\n' +
   '            <div \"circular-second\"></div>\n' +
   '        </div>\n' +
   '        <ul>\n' +
   '            <li \"killer\">\n' +
   '                <div \"triangle1\"></div>\n' +
   '                <span \"triangle2\">杀手杀人</span>\n' +
   '            </li>\n' +
   '            <div \"box2\">\n' +
   '            <span>昨晚' + theKillNum + '号被杀，真实身份是' + theKillId + '</span>\n' +
   '            </div>\n' +
   '        </ul>\n' +
   '        <ul>\n' +
   '            <li \"die\">\n' +
   '                <div \"triangle1\"></div>\n' +
   '                <span \"triangle2\">亡灵发表遗言</span>\n' +
   '            </li>\n' +
   '        </ul>\n' +
   '        <ul>\n' +
   '            <li \"player\">\n' +
   '                <div \"triangle1\"></div>\n' +
   '                <span \"triangle2\">玩家依次发言</span>\n' +
   '            </li>\n' +
   '        </ul>\n' +
   '        <ul>\n' +
   '            <li \"vote\">\n' +
   '                <div \"triangle1\"></div>\n' +
   '                <span \"triangle2\">投票</span>\n' +
   '            </li>\n' +
   '        </ul>\n' +
   '            <div \"box2\">\n' +
   '            <span>昨晚' + theVoteNum + '号被投死，真实身份是' +  theVoteId + '</span>\n' +
   '            </div>\n' +
   '    </div>';

<div "content">
<span></span>
<span "day">第1天</span>
<span "icon"></span>
</div>
<div "hidden">
<div "bar">
<div "circular-first"></div>
<div "circular-second"></div>
</div>
<ul>
<li "killer">
<div "triangle" id="one1"></div>
<span id="one2">杀手杀人</span>
</li>
</ul>
<div "box">
<span>昨晚<span id="realNum">theKillNum</span>号被杀,真实身份是<span id="realId">theKillRole</span></span>
</div>
<ul>
<li "die">
<div "triangle" id="two1"></div>
<span id="two2">亡灵发表遗言</span>
</li>
</ul>
<ul>
<li "player">
<div "triangle" id="three1"></div>
<span id="three2">玩家依次发言</span>
</li>
</ul>
<ul>
<li "vote">
<div "triangle" id="four1"></div>
<span id="four2">投票</span>
</li>
</ul>
<div "box1">
<span>昨晚  theKillNum 号被杀真实身份是 Thekillrole </span>
</div>
</div>

该问题已被官方收录

怎样使游戏流程的已变色步骤，在法官查看或杀人（投票）页面跳转后保持背景不变色

2

1

本地储存

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

<header>
    <span id="return" class="fa fa-angle-left"></span>
    <span>法官日记</span>
    <span id="close" class="fa fa-times"></span>
</header>
<main>
    <div class="oneDayCopy">
        <div class="dayCopy">
            <div class="dateCopy">
                <span class="text-center btn-block">第1天</span>
            </div>
        </div>
        <div class="happeningCopy">
            <div class="asideCopy"></div>
            <div class="incidentsCopy">
                <div id="kill" class="incidentCopy">
                    <img class="moon" src="../img/night.png" alt="">
                    <a class="kill"><span class="triangle-leftCopy"></span>杀手杀人</a>
                </div>
                <div class="killMsgCopy">
                    <span id="beKilledCopy"></span>
                    号被杀手杀死，真实身份是
                    <span id="beKilledRoleCopy"></span>
                </div>
                <div id="deadSpeakCopy" class="incidentCopy">
                    <img class="sun" src="../img/day.png" alt="">
                    <a class="death"><span class="triangle-leftCopy"></span>亡灵发言</a>
                </div>
                <div id="aliveSpeakCopy" class="incidentCopy">
                    <a class="aliveSpeak"><span class="triangle-leftCopy"></span>玩家依次发言</a>
                </div>
                <div id="voteCopy" class="incidentCopy">
                    <a class="vote"><span class="triangle-leftCopy"></span>玩家投票</a>
                </div>
                <div class="voteMsgCopy">
                    <span id="beVoted"></span>
                    号被投票杀死，真实身份是
                    <span id="beVotedRole"></span>
                </div>
            </div>
        </div>
    </div>
</main>
<footer>
    <a class="over">结束游戏</a>
    <a class="watch">法官查看</a>
</footer>

JS代码（部分）
var playerStatus=JSON.parse(sessionStorage.getItem('playerStatus')),
    days=JSON.parse(sessionStorage.getItem('days')),
    beKillNum=JSON.parse(sessionStorage.getItem('beKillNum')),
    beVoteNum=JSON.parse(sessionStorage.getItem('beVoteNum')),
    step=sessionStorage.getItem('step');
//为法官查看页面准备
sessionStorage.setItem('playerStatus',JSON.stringify(playerStatus));
sessionStorage.setItem('beKillNum',JSON.stringify(beKillNum));
sessionStorage.setItem('beVoteNum',JSON.stringify(beVoteNum));
sessionStorage.setItem('days',JSON.stringify(days));

switch(step){
        case "dead":
            var i=days-1;
            changeColor($('.kill'),$('.kill .triangle-leftCopy'));
            $('.killMsgCopy').text(beKillNum[beKillNum.length-(1+i)].number+"号被杀死，真实身份是"+beKillNum[beKillNum.length-(1+i)].role).show();
            break;
        case "speak":
            i=days-1;
            changeColor($('.kill'),$('.kill .triangle-leftCopy'));
            $('.killMsgCopy').text(beKillNum[beKillNum.length-(1+i)].number+"号被杀死，真实身份是"+beKillNum[beKillNum.length-(1+i)].role).show();
            changeColor($('.death'),$('.death .triangle-leftCopy'));
            break;
        case "vote":
            i=days-1;
            changeColor($('.kill'),$('.kill .triangle-leftCopy'));
            $('.killMsgCopy').text(beKillNum[beKillNum.length-(1+i)].number+"号被杀死，真实身份是"+beKillNum[beKillNum.length-(1+i)].role).show();
            changeColor($('.death'),$('.death .triangle-leftCopy'));
            changeColor($('.aliveSpeak'),$('.aliveSpeak .triangle-leftCopy'));
            break;
    }
    //变色函数
    function changeColor(a,b){
        a.css({
            'backgroundColor':'#83b09a',
            'borderColor':'#83b09a'
        });
        b.css('borderRightColor','#83b09a');
    }

该问题已被官方收录

如何在结果页获取杀人数据和投票数据，并把杀过的人和投死的人展示出来？

1

本地储存控制流程语句

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

<div>太棒了!你知道么？在捉鬼游戏中只有20%的卧底取得游戏最终的胜利哦!</div>
<p>本次游戏共计用时0小时25分钟</p>
<p>杀手0人     平民6人</p>


var result = document.getElementById("result")

该问题已被官方收录

为什么杀人和投票过程不能进行到最后？

0

1

控制流程语句本地储存

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

for (var i=0;i<s.length;i++){
per[i]={}
per[i].hao=i
per[i].id=s[i]
per[i].zhu="life"
}

该问题已被官方收录

富文本编辑器wangEDITOR数据无法与AngularJS绑定

0

1

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 图片

class="cursor-pointer"> 文本

该问题已被官方收录

怎么用JQ写输入验证

0

1

Jquery操作

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

..