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

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

咨询电话 : 010-59478634

亚马逊运营

全部问题

已收录问题

未收录问题

没有找到答案，去提问>>>

该问题已被官方收录

跳转到另一个页面之后，原来的页面数据如何保存

3

5

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

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

$(".slayer:eq(0)").click(function(){
        window.location.href = "task2-kill.html";
        var ddd = $(".slayer:eq(0)").css("background-color","#ccc");//跳转页面后修改CSS样式
        var ccc = $(".slayer-i:eq(0)").css("border","#ccc");
        sessionStorage.setItem("color",ddd);
    });

该问题已被官方收录

click点击时间

5

4

事件控制流程语句

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

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

for (i = 0 ; i < playerTotalNum.length ; i++) {
playerId = $('<div></div>')
    .text(playerTotalNum[i])
    .addClass('player_box')
;
knife = $('<div></div>')
    .addClass('knife')
;
playerNum = $('<div></div>')
    .text(i+1 + "号")
    .addClass('player_num')
;
playerId.append(knife)
;
playerId.append(playerNum)
;
main.append(playerId)
;
}

该问题已被官方收录

如何在进入杀手杀人的步骤后，跳转回页面，保存之前的状态

3

2

本地储存

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

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

function play() {
    let audio = document.getElementById('music');
    if (audio.paused) {
        audio.play();//audio.play();// 播放
    }
    else {
        audio.pause();// 暂停
    }
}//之前写的控制radio的函数；


//jqery
$(document).ready(function () {
    var day = 1;//记录天数
    var playerObj = [];//玩家
    var beKiller = [];//被杀的，存进来；
    var beVoter = [];//被投的，存过来；
    var player = JSON.parse(sessionStorage.getItem("player"));
// console.log(player);//检查身份数组；
    for (i = 0; i < player.length; i++) {
        var number = i + 1;
        var add = "<div class=\"hover\">\n" +
            "            <div class=\"father\">\n" +
            "                <div class=\"left\">" + player[i] + "</div>\n" +
            "                <div class=\"text\">" + number + "号</div>\n" +
            "            </div>\n" +
            "        </div>";
        $(".set").append(add);

        playerObj[i] = {
            role: player[i],
            status: "alive",
            num: number
        }//身份数组内容对象化附属性
    }
    ;
    for (i = 0;i<player.length;i++) {
        if (playerObj.status == "dead") {
            $(".left").css("backgroundColor","#82af9a");
        }
    }
    sessionStorage.setItem("playerObj", JSON.stringify(playerObj));
    sessionStorage.setItem("beKiller", JSON.stringify(beKiller));
    sessionStorage.setItem("beVoter", JSON.stringify(beVoter));
    sessionStorage.setItem("day", JSON.stringify(day));
    sessionStorage.setItem("step","ready");
    console.log(playerObj);
})

该问题已被官方收录

用jquery发起异步请求，点击登录按钮，跳转405页面

2

2

Ajax登陆 Jquery操作

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

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

var date=new Date();
   var timer=date.getTime().toString();
    $(document).ready(function () {
        $('button').click(function () {
            $.post('/carrots-admin-ajax/a/login?t='+timer,
                {
                    name:$('#users').value,
                    pwd:$('#word').value
                },
                function(data,status){
                alert("数据: \n" + data + "\n状态: " + status);
            });
        });
    });

该问题已被官方收录

天数不知道怎样复制，且是重置的新的状态

1

1

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

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

var payPerson=JSON.parse(sessionStorage.getItem('payPerson'));
var statusing=sessionStorage.getItem('statusing');

console.log(statusing);
//状态
function step(type) {
    switch (type) {
      //情况一kill
      case "kill":
        if (statusing == "kill") {
           //转移状态
           statusing = "vote";
          //背景颜色  
           index=0;
          sessionStorage.index=index;
         
          //记录状态
          sessionStorage.statusing = statusing;
          location.href = "../js2/js2-kill.html";
          console.log('正在进行模式'+statusing);
          
          //改变颜色
          sessionStorage.background='#83b09a';
          //改变点击框颜色
          $('.step').eq(0).css('background-color',background);
          $('.triangleLeft').eq(0).css('color',background);
          
        }else{
          alert('请按顺序执行')
         
        }
        break;
        //情况二发言
      case "vote":
        if (statusing == "vote") {
          //改变状态
          statusing = "vote1";
          //背景颜色参数增加
          index=index+1;
          //保存参数
          sessionStorage.index=index;
          sessionStorage.statusing = statusing;
          alert('亡灵发表遗言')
          console.log('正在进行模式'+statusing);
          
          //遍历改变颜色
          for(let x=index;x>=0;x--){
            $('.step').eq(x).css('background-color',background);
            $('.triangleLeft').eq(x).css('color',background);
          }
          
        }else{
          alert('请按顺序执行')
        }
        break;
        //情况三发言二
      case "vote1":
        if (statusing == "vote1") {
          //改变状态
          statusing = "vote2";
          //改变颜色的参数递增
          index=index+1;
          //保存类的参数
          sessionStorage.index=index;
          //保存状态
          sessionStorage.statusing = statusing;
          
          console.log('正在进行模式'+statusing);
          //遍历改变颜色
          for(let x=index;x>=0;x--){
            $('.step').eq(x).css('background-color',background);
            $('.triangleLeft').eq(x).css('color',background);
          }
         //行动
          alert('玩家依次发言')
  
        }else{
          alert('请按顺序执行')
        }
        break;
      //请情况四：投票
      case "vote2":
        if (statusing == "vote2") {
          //状态改变
          statusing = "kill";
          //背景颜色参数改变
          index=index+1;
          //保存框的参数
          sessionStorage.index=index;
          //保存状态
          sessionStorage.statusing = statusing;
          for(let x=index;x>=0;x--){
            $('.step').eq(x).css('background-color',background);
            $('.triangleLeft').eq(x).css('color',background);
          }
          //投票后天数+1
          day=day+1;
          sessionStorage.day=day;
          
          console.log(payPerson);
          console.log('正在进行模式'+statusing);
          $('.contain').eq(day-2).after($('.contain').eq(day-2).clone(true))
          // clone();
          // demo();
          location.href = "../js2/js2-kill.html";

        }
    }
}

该问题已被官方收录

完成投票后，如果一天杀手没有杀人，第一天的杀人信息会被第二天的信息给覆盖

0

1

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

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

<div class="head">
    <div class="h-img1"></div>
    法官台本
    <div class="h-img2"></div>
</div>

<div class="all">
<div class="addBox">
<div class="dateNow" id="now">第<span class="dayNum">1</span>天</div>

<div class="main-box">
    <div class="triangle"></div>

    <div class="box">

        <div class="border"></div>
        <div class="logo1"></div>
            <div class="kill mark1" >
                <div class="triLeft1 mark2"></div><span>杀手杀人</span></div>

            <!--<div class="killOld ">没有进行任何操作</div>-->

            <div class="tell mark1" >
                <div class="logo2"></div>
                <div class="triLeft2 mark2"></div><span>亡灵发表遗言</span></div>

 $(".dateNow").text("第"+dateNum+"天");

    for (var i=1; i<dateNum ; i++){
        var html =
            "<div class=\"addBox\">\n" +
            "<div class=\"date\" >第<span class=\"dayNum\">"+i+"</span>天</div>\n" +
            "<div class=\"main-box\">\n" +
            "    <div class=\"triangle\"></div>\n" +
            "    <div class=\"box\">\n" +
            "        <div class=\"border\"></div>\n" +
            "        <div class=\"logo1\"></div>\n" +
            "            <div class=\"kill mark1\" >\n" +
            "                <div class=\"triLeft1 mark2\"></div><span>杀手杀人</span></div>\n" +
            "            <div class=\"killOld \">"+(Number(arrKillDead[i-1]+1))+"号被杀手杀了，真实身份是平民</div>\n" +
            "            <div class=\"tell mark1\" >\n" +
            "                <div class=\"logo2\"></div>\n" +
            "                <div class=\"triLeft2 mark2\"></div><span>亡灵发表遗言</span></div>\n" +
            "            <div class=\"speak mark1\" >\n" +
            "                <div class=\"triLeft3 mark2\"></div><span>玩家依次发言</span></div>\n" +
            "            <div class=\"vote mark1\" >\n" +
            "                <div class=\"triLeft4 mark2\"></div><span>全民投票</span></div>\n" +
            "    </div>\n" +
            "    </div>\n" +
            "</div>";

        $(".addBox").eq(i-1).before(html);
        $(".addBox").eq(i-1).find(".main-box").hide();
        //隐藏前天盒子
        $(".box").eq(i-1).find(".mark1").css({background:"#2375af"});
        $(".box").eq(i-1).find(".mark2").css({borderColor:"transparent #2375af transparent transparent"});

        // function aboutKillED () {
        //     if (deadeNum[dateNum-2] == "X") {
        //         $(".kill").eq(i-1).after("<div class='killTxt'>" +
        //             '没有进行任何操作' +
        //             "</div>");
        //     }
        //     else  {
        //         $(".kill").eq(i-1).after("<div class='killTxt'>" + (Number(arrKillDead[i-1])+1) +
        //             '号被杀手杀了，真实身份是平民' +
        //             "</div>");
        //     }
        // }
        // aboutKillED();
        // abuotVotED();
        //思路一（无操作还是有点问题）

        if (arrKillDead[i-1] === "n"){
            $('.killOld').eq(i-1).text("晚上：平安无事");
        }
        $(".vote").eq(i-1).after("<div class='killTxt'>" + (Number(arrVoteDead[i-1])+1) +
            '号被投死了，真实身份是' + (identity[voteDeade]) +
            "</div>");

        $('.all').scrollTop(9999);
    }

    $(".date").click(function () {
        $(this).next().slideToggle();
    });

该问题已被官方收录

新旧天数事件如何分离?

0

1

数据类型本地储存

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

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

  for(var i=0;i<days-1;i++){
                var writeHtml =
                    "    <div class=\"oneDay\">\n" +
                    "        <div class=\"day\">\n" +
                    "            <div class=\"date\">\n" +
                    "                <span class=\"text-center btn-block\">\n" +
                    "                    第"+(i+2)+ "天\n" +
                    "                    <span class=\"fa fa-angle-down pull-right\"></span>\n" +
                    "                </span>\n" +
                    "            </div>\n" +
                    "        </div>\n" +
                    "        <div class=\"happening\">\n" +
                    "            <div class=\"aside\"></div>\n" +
                    "            <div class=\"incidents\">\n" +
                    "                <div id=\"kill\" class=\"incident\">\n" +
                    "                    <img class=\"moon\" src=\"../img/night.png\" alt=\"\">\n" +
                    "                    <a class=\"kill\"><span class=\"triangle-left\"></span>杀手杀人</a>\n" +
                    "                </div>\n" +
                    "                <div class=\"killMsg\">\n" +
                                     beKillNum[beKillNum.length-1].number  +
                    "                    号被杀手杀死，真实身份是\n" +
                                     beKillNum[beKillNum.length-1].role +
                    "                </div>\n" +
                    "                <div id=\"deadSpeak\" class=\"incident\">\n" +
                    "                    <img class=\"sun\" src=\"../img/day.png\" alt=\"\">\n" +
                    "                    <a class=\"death\"><span class=\"triangle-left\"></span>亡灵发言</a>\n" +
                    "                </div>\n" +
                    "                <div id=\"aliveSpeak\" class=\"incident\">\n" +
                    "                    <a class=\"aliveSpeak\"><span class=\"triangle-left\"></span>玩家依次发言</a>\n" +
                    "                </div>\n" +
                    "                <div id=\"vote\" class=\"incident\">\n" +
                    "                    <a class=\"vote\"><span class=\"triangle-left\"></span>玩家投票</a>\n" +
                    "                </div>\n" +
                    "                <div class=\"voteMsg\">\n" +
                                         beVoteNum[beKillNum.length-1].number +
                    "                    号被投票杀死，真实身份是\n" +
                                         beVoteNum[beKillNum.length-1].role    +
                    "                </div>\n" +
                    "            </div>\n" +
                    "        </div>\n" +
                    "    </div>\n";
                $('main').append(writeHtml);
            }

该问题已被官方收录

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
}

该问题已被官方收录

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>法官台本</title>
    <link rel="stylesheet" type="text/css" href="../scss/version.css">
    <script src="../js/state-machine.js"></script>
</head>

<body>
    <header>
        <a class="return" href="./journal.html"></a>
        <h4>法官台本</h4>
        <a class="right" href="#">
            <span></span>
        </a>
    </header>
    <main>
        <div class="itme">
            <div class="day">
                第<span class="dayss">一</span>天
                <span class="dropdown"></span>
            </div>
            <div class="order">
                <span class="triangle"></span>
                <div class="box">
                    <div class="one">
                        <img src="../img/taiyang.png">
                    </div>
                    <div class="two">
                        <img src="../img/yueliang.png">
                    </div>
                    <button class="killingg">杀手杀人</button>
                    <p class="sha" id="shaa"></p>
                    <button class="undeadspeakk">亡灵发表遗言</button>
                    <button class="playerspeakingg">玩家依次发言</button>
                    <button class="votingg">全民投票</button>
                    <p class="tou"></p>
                </div>
            </div>
        </div>
    </main>
    <footer>
        <button id="end">结束游戏</button>
        <button id="record">法官日志</button>
    </footer>
    <script>
        var dayss = document.getElementsByClassName("dayss");
        var itme = document.getElementsByClassName("itme"); //获取克隆的源节点
        var order = document.getElementsByClassName("order");
        var sha = document.getElementsByClassName("sha");
        var tou = document.getElementsByClassName("tou");
        var daybtn = document.getElementsByClassName("day");
        var box = document.getElementsByClassName("box");
        //四个按钮的节点获取
        var killingg = document.getElementsByClassName("killingg");
        var undeadspeakk = document.getElementsByClassName("undeadspeakk");
        var playerspeakingg = document.getElementsByClassName("playerspeakingg");
        var votingg = document.getElementsByClassName("votingg");
        //console.log(p);
        var step = sessionStorage.getItem("step"); //提取步骤
        // console.log(step)
        //提取被杀死的平民信息
        if (sessionStorage.getItem("killDead")) {
            var killDead = JSON.parse(sessionStorage.getItem("killDead"));
        } else {
            var killDead = [];
        }
        // console.log(killDead);
        //提取被投死的玩家信息
        if (sessionStorage.getItem("voteDead")) {
            var voteDead = JSON.parse(sessionStorage.getItem("voteDead"));
        } else {
            var voteDead = [];
        }
        console.log(voteDead)
        // console.log(voteDead);
        //提取天数
        if (sessionStorage.getItem("days")) {
            var days = sessionStorage.getItem("days");
        } else {
            var days = 1;
        }
        console.log(days);
        //创建天数数组
        var daysArray = ["十", "一", "二", "三", "四", "五", "六", "七", "八", "九"];
        sessionStorage.setItem("daysArray",JSON.stringify(daysArray));
        //创建状态机数组
        // var state = ["kill", "undead", "playerspeak", "vote"];
        //创建执行顺序状态机
        var fsm = new StateMachine({
            //当前状态
            init: "kill",
            //状态转换
            transitions: [{
                    name: "killing",
                    from: "kill",
                    to: "undead"
                },
                {
                    name: "undeadspeak",
                    from: "undead",
                    to: "playerspeak"
                },
                {
                    name: "playerspeaking",
                    from: "playerspeak",
                    to: "vote"
                },
                {
                    name: "voting",
                    from: "vote",
                    to: "kill"
                }
            ],
            //构造状态机的方法
            methods: {
                /* 如果状态转换不能正常转换就会触发下面的错误处理机制 */
                onInvalidTransition: function (transitions, from, to) {
                    switch (from) {
                        case "kill":
                            alert("请点击杀手杀人");
                            break;
                        case "undead":
                            alert("请点击亡灵发表遗言");
                            break;
                        case "playerspeak":
                            alert("请点击玩家依次发言");
                            break;
                        case "vote":
                            alert("请点击请点击全民投票");
                            break;
                    }
                }
            }
        });

        window.onload = function () {
            if (days > 1) {
                for (let i = 0; i < days - 1; i++) {
                    var cloneNode = itme[0].cloneNode(true);
                    itme[0].parentNode.appendChild(cloneNode);
                    // console.log(itme)
                    // console.log(itme[i])
                    console.log(box[3])
                    var button = box[i].getElementsByTagName("button"); //获取button
                    // console.log(button);
                    for (let i = 0; i < button.length; i++) {
                        button[i].style.background = "red";
                    }
                    // console.log(itme)

                    var button = box[i + 1].getElementsByTagName("button"); //获取当前天的button
                    for (let i = 0; i < button.length; i++) {
                        button[i].style.background = "#24A7C6";
                    }
                    dayss[i].innerHTML = daysArray[i + 1]; //修改天数数字
                    sha[i].innerHTML = killDead[i];
                    tou[i].innerHTML = voteDead[i];
                    // console.log(i);
                    // console.log(voteDead)
                    //  console.log(tou[i])
                    //  console.log(tou[1])

                }

                for (let i = 0; i < days - 1; i++) { //当到下一天的时候，上一天自动隐藏
                    //console.log(order[i])
                    order[i].classList.add("none");
                }
                dayss[days - 1].innerHTML = daysArray[days]; //修改当前天数数字
                if (killDead[days - 1] == undefined) { //修改当前杀人信息
                    sha[days - 1].innerHTML = "";

                } else {
                    sha[days - 1].innerHTML = killDead[days - 1];
                }
                if (voteDead[days - 1] == undefined) { //修改当前投死信息
                    tou[days - 1].innerHTML = "";

                } else {
                    tou[days - 1].innerHTML = voteDead[days - 1];
                }

            }
            if (days == 1) {
                //console.log( killDead[0])
                if (killDead[0] == undefined) {
                    sha[0].innerText = "";
                } else {
                    sha[0].innerText = killDead[0];
                }
            }
            for (let i = 0; i < days; i++) {
                //console.log(daybtn[i])
                daybtn[i].onclick = function () {
                    order[i].classList.toggle("none");
                }
                killingg[i].onclick = function () {
                    //console.log(fsm.can('killing'));
                    fsm.killing();
                    if (step == null) {
                        location.href = ('killing.html');
                    }
                }
                undeadspeakk[i].onclick = function () {
                    //console.log(fsm.can('undeadspeak'));
                    fsm.undeadspeak();
                    if (step == 1) {
                        alert("亡灵发表遗言");
                        undeadspeakk[i].style.background = "red";
                        step = 2;
                        sessionStorage.setItem("step", step);
                    }
                }
                playerspeakingg[i].onclick = function () {
                    //console.log(fsm.can('playerspeaking'));
                    fsm.playerspeaking();
                    if (step == 2) {
                        alert("玩家发表言");
                        playerspeakingg[i].style.background = "red";
                        step = 3;
                        sessionStorage.setItem("step", step);
                    }
                }
                // console.log(step);
                votingg[i].onclick = function () {
                    //console.log(fsm.can('voting'));
                    fsm.voting();
                    if (step == 3) {
                        sessionStorage.setItem("days", days);
                        sessionStorage.setItem("step", step);
                        location.href = ('vote.html');
                    }
                }

            }
            switch (step) {
                case "1":
                    fsm.killing();
                    for (let i = 0; i < days; i++) {
                        killingg[i].style.background = "red";
                    }
                    break;
                case "2":
                    fsm.killing();
                    fsm.undeadspeak();
                    for (let i = 0; i < days; i++) {
                        killingg[i].style.background = "red";
                        undeadspeakk[i].style.background = "red";
                    }
                    break;
                case "3":
                    fsm.killing();
                    fsm.undeadspeak();
                    fsm.playerspeaking();
                    for (let i = 0; i < days; i++) {
                        killingg[i].style.background = "red";
                        undeadspeakk[i].style.background = "red";
                        playerspeakingg[i].style.background = "red";
                    }

                    break;
                case "4":
                    step = null;
                    break;
            }
            // for(var i =0 ; i < days - 1 ; i++){
                
            // }
        }
        //第一天的步骤

        //退出游戏按钮
        var close = document.getElementsByClassName("right")[0];
        close.onclick = function () {
            if (confirm("确定退出游戏么？")) {
                sessionStorage.clear();
                location.href = ("homepage.html");
            }
        }
        //法官日记按钮
        var record = document.getElementById("record");
        record.onclick = function () {
            location.href = ("record.html");
        }
        //结束游戏按钮
        var end = document.getElementById("end");
        end.onclick = function () {
            if (confirm("确定退出游戏么？")) {
                sessionStorage.clear();
                location.href = ("homepage.html");
            }
        }
    </script>

</body>

</html><!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>法官台本</title>
    <link rel="stylesheet" type="text/css" href="../scss/version.css">
    <script src="../js/state-machine.js"></script>
</head>

<body>
    <header>
        <a class="return" href="./journal.html"></a>
        <h4>法官台本</h4>
        <a class="right" href="#">
            <span></span>
        </a>
    </header>
    <main>
        <div class="itme">
            <div class="day">
                第<span class="dayss">一</span>天
                <span class="dropdown"></span>
            </div>
            <div class="order">
                <span class="triangle"></span>
                <div class="box">
                    <div class="one">
                        <img src="../img/taiyang.png">
                    </div>
                    <div class="two">
                        <img src="../img/yueliang.png">
                    </div>
                    <button class="killingg">杀手杀人</button>
                    <p class="sha" id="shaa"></p>
                    <button class="undeadspeakk">亡灵发表遗言</button>
                    <button class="playerspeakingg">玩家依次发言</button>
                    <button class="votingg">全民投票</button>
                    <p class="tou"></p>
                </div>
            </div>
        </div>
    </main>
    <footer>
        <button id="end">结束游戏</button>
        <button id="record">法官日志</button>
    </footer>
    <script>
        var dayss = document.getElementsByClassName("dayss");
        var itme = document.getElementsByClassName("itme"); //获取克隆的源节点
        var order = document.getElementsByClassName("order");
        var sha = document.getElementsByClassName("sha");
        var tou = document.getElementsByClassName("tou");
        var daybtn = document.getElementsByClassName("day");
        var box = document.getElementsByClassName("box");
        //四个按钮的节点获取
        var killingg = document.getElementsByClassName("killingg");
        var undeadspeakk = document.getElementsByClassName("undeadspeakk");
        var playerspeakingg = document.getElementsByClassName("playerspeakingg");
        var votingg = document.getElementsByClassName("votingg");
        //console.log(p);
        var step = sessionStorage.getItem("step"); //提取步骤
        // console.log(step)
        //提取被杀死的平民信息
        if (sessionStorage.getItem("killDead")) {
            var killDead = JSON.parse(sessionStorage.getItem("killDead"));
        } else {
            var killDead = [];
        }
        // console.log(killDead);
        //提取被投死的玩家信息
        if (sessionStorage.getItem("voteDead")) {
            var voteDead = JSON.parse(sessionStorage.getItem("voteDead"));
        } else {
            var voteDead = [];
        }
        console.log(voteDead)
        // console.log(voteDead);
        //提取天数
        if (sessionStorage.getItem("days")) {
            var days = sessionStorage.getItem("days");
        } else {
            var days = 1;
        }
        console.log(days);
        //创建天数数组
        var daysArray = ["十", "一", "二", "三", "四", "五", "六", "七", "八", "九"];
        sessionStorage.setItem("daysArray",JSON.stringify(daysArray));
        //创建状态机数组
        // var state = ["kill", "undead", "playerspeak", "vote"];
        //创建执行顺序状态机
        var fsm = new StateMachine({
            //当前状态
            init: "kill",
            //状态转换
            transitions: [{
                    name: "killing",
                    from: "kill",
                    to: "undead"
                },
                {
                    name: "undeadspeak",
                    from: "undead",
                    to: "playerspeak"
                },
                {
                    name: "playerspeaking",
                    from: "playerspeak",
                    to: "vote"
                },
                {
                    name: "voting",
                    from: "vote",
                    to: "kill"
                }
            ],
            //构造状态机的方法
            methods: {
                /* 如果状态转换不能正常转换就会触发下面的错误处理机制 */
                onInvalidTransition: function (transitions, from, to) {
                    switch (from) {
                        case "kill":
                            alert("请点击杀手杀人");
                            break;
                        case "undead":
                            alert("请点击亡灵发表遗言");
                            break;
                        case "playerspeak":
                            alert("请点击玩家依次发言");
                            break;
                        case "vote":
                            alert("请点击请点击全民投票");
                            break;
                    }
                }
            }
        });

        window.onload = function () {
            if (days > 1) {
                for (let i = 0; i < days - 1; i++) {
                    var cloneNode = itme[0].cloneNode(true);
                    itme[0].parentNode.appendChild(cloneNode);
                    // console.log(itme)
                    // console.log(itme[i])
                    console.log(box[3])
                    var button = box[i].getElementsByTagName("button"); //获取button
                    // console.log(button);
                    for (let i = 0; i < button.length; i++) {
                        button[i].style.background = "red";
                    }
                    // console.log(itme)

                    var button = box[i + 1].getElementsByTagName("button"); //获取当前天的button
                    for (let i = 0; i < button.length; i++) {
                        button[i].style.background = "#24A7C6";
                    }
                    dayss[i].innerHTML = daysArray[i + 1]; //修改天数数字
                    sha[i].innerHTML = killDead[i];
                    tou[i].innerHTML = voteDead[i];
                    // console.log(i);
                    // console.log(voteDead)
                    //  console.log(tou[i])
                    //  console.log(tou[1])

                }

                for (let i = 0; i < days - 1; i++) { //当到下一天的时候，上一天自动隐藏
                    //console.log(order[i])
                    order[i].classList.add("none");
                }
                dayss[days - 1].innerHTML = daysArray[days]; //修改当前天数数字
                if (killDead[days - 1] == undefined) { //修改当前杀人信息
                    sha[days - 1].innerHTML = "";

                } else {
                    sha[days - 1].innerHTML = killDead[days - 1];
                }
                if (voteDead[days - 1] == undefined) { //修改当前投死信息
                    tou[days - 1].innerHTML = "";

                } else {
                    tou[days - 1].innerHTML = voteDead[days - 1];
                }

            }
            if (days == 1) {
                //console.log( killDead[0])
                if (killDead[0] == undefined) {
                    sha[0].innerText = "";
                } else {
                    sha[0].innerText = killDead[0];
                }
            }
            for (let i = 0; i < days; i++) {
                //console.log(daybtn[i])
                daybtn[i].onclick = function () {
                    order[i].classList.toggle("none");
                }
                killingg[i].onclick = function () {
                    //console.log(fsm.can('killing'));
                    fsm.killing();
                    if (step == null) {
                        location.href = ('killing.html');
                    }
                }
                undeadspeakk[i].onclick = function () {
                    //console.log(fsm.can('undeadspeak'));
                    fsm.undeadspeak();
                    if (step == 1) {
                        alert("亡灵发表遗言");
                        undeadspeakk[i].style.background = "red";
                        step = 2;
                        sessionStorage.setItem("step", step);
                    }
                }
                playerspeakingg[i].onclick = function () {
                    //console.log(fsm.can('playerspeaking'));
                    fsm.playerspeaking();
                    if (step == 2) {
                        alert("玩家发表言");
                        playerspeakingg[i].style.background = "red";
                        step = 3;
                        sessionStorage.setItem("step", step);
                    }
                }
                // console.log(step);
                votingg[i].onclick = function () {
                    //console.log(fsm.can('voting'));
                    fsm.voting();
                    if (step == 3) {
                        sessionStorage.setItem("days", days);
                        sessionStorage.setItem("step", step);
                        location.href = ('vote.html');
                    }
                }

            }
            switch (step) {
                case "1":
                    fsm.killing();
                    for (let i = 0; i < days; i++) {
                        killingg[i].style.background = "red";
                    }
                    break;
                case "2":
                    fsm.killing();
                    fsm.undeadspeak();
                    for (let i = 0; i < days; i++) {
                        killingg[i].style.background = "red";
                        undeadspeakk[i].style.background = "red";
                    }
                    break;
                case "3":
                    fsm.killing();
                    fsm.undeadspeak();
                    fsm.playerspeaking();
                    for (let i = 0; i < days; i++) {
                        killingg[i].style.background = "red";
                        undeadspeakk[i].style.background = "red";
                        playerspeakingg[i].style.background = "red";
                    }

                    break;
                case "4":
                    step = null;
                    break;
            }
            // for(var i =0 ; i < days - 1 ; i++){
                
            // }
        }
        //第一天的步骤

        //退出游戏按钮
        var close = document.getElementsByClassName("right")[0];
        close.onclick = function () {
            if (confirm("确定退出游戏么？")) {
                sessionStorage.clear();
                location.href = ("homepage.html");
            }
        }
        //法官日记按钮
        var record = document.getElementById("record");
        record.onclick = function () {
            location.href = ("record.html");
        }
        //结束游戏按钮
        var end = document.getElementById("end");
        end.onclick = function () {
            if (confirm("确定退出游戏么？")) {
                sessionStorage.clear();
                location.href = ("homepage.html");
            }
        }
    </script>

</body>

</html>

该问题已被官方收录

玩家发言怎么保存变色

0

1

Ajax登陆

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

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

//亡灵发表遗言按钮
        ghost[i].onclick = function talk() {
            if (window, getComputedStyle(kill[i], null).backgroundColor != 'rgb(204, 204, 204)') {
                alert('按顺序走');
                return
            }
            if (window, getComputedStyle(ghost[i], null).backgroundColor == 'rgb(204, 204, 204)') {
                alert('请进行下一项');
                return
            }
            alert('表明身份发表遗言');
            ghost[i].style.backgroundColor = '#ccc';
            triangleb[i].style.borderRight = '.7rem solid #ccc';
        }
        //玩家依次发言按钮
        player[i].onclick = function playerTalk() {
            if (window, getComputedStyle(ghost[i], null).backgroundColor != 'rgb(204, 204, 204)') {
                alert('按顺序走');
                return;
            }
            if (window, getComputedStyle(player[i], null).backgroundColor == 'rgb(204, 204, 204)') {
                alert('请进行下一项');
                return
            }
            alert('玩家依次发言');
            player[i].style.backgroundColor = '#ccc';
            trianglec[i].style.borderRight = '.7rem solid #ccc';
        }

去第页

Copyright ©2015 北京葡萄藤信息技术有限公司 All Rights Reserved | 京ICP备15035574号-1