Question

我正在尝试制作一个有多个结局的游戏，但是，代码不断以我不想要的方式跳过。每当我到达有两条路径的点时，代码就会一遍又一遍地重复选项，而不是预期的。它也没有以线性方式讲述故事，请帮助。

Repl.it链接：enter code here https://repl.it/@samkaraka/AjarForestgreenKissingbug

var plotDevices = [];

function make (b, c,  e,  g, h){
    this.optionArray = [];
    this.optionArray = b;
    this.optionText = c;
    this.storyText = e;
    this.color = g;
    this.bgColor = h;
}

function displayPlotDevice (num){



    if (plotDevices[num].bgColor !== undefined){
        $("body").css("background-color", plotDevices[num].bgColor);

    }
    if (plotDevices[num].color !== undefined){
        $("body").css("color", plotDevices[num].color);
        $("#story").css("border-color", plotDevices[num].color);
    }

    $("#optionArea").remove();
    $("body").append("<div id='optionArea'></div>");
    $("p").empty("#story");
    $("#story p").text(plotDevices[num].storyText);
//Upon putting in the following function, I could more easily follow the weird pattern that the script was taking alert(plotDevices[num].storyText);
    //One option (Nasrrative transition)
        if (plotDevices[num].optionArray.length == 1){
            setTimeout(
            function() {
                $("body").click(function() {
                    displayPlotDevice(plotDevices[num].optionArray[0]);
                });
            }, 500);
    //Two Options (A pretty big decision)
        } else if(plotDevices[num].optionArray.length == 2){
            setTimeout(
            function() {

            $("#optionArea").append("<div class='twoOptions' onclick='displayPlotDevice("+ plotDevices[num].optionArray[0] +")'> <p> " + plotDevices[plotDevices[num].optionArray[0]].optionText + " </p></div>");
            $("#optionArea").append("<div class='twoOptions' onclick='displayPlotDevice("+ plotDevices[num].optionArray[1] +")'> <p> " + plotDevices[plotDevices[num].optionArray[1]].optionText + " </p></div>");

            }, 500);
    //Multiple Options (Usually for convos)
        } else {
            setTimeout(
            function() {
                $("body").click(function() {
                    displayPlotDevice(plotDevices[num].optionArray[0]);
                });
            }, 1000);
        }
}

function start (){
    $("body").empty();
    $("body").append("<div id='story'><p>test</p></div>");
    $("body").append("<div id='optionArea'><p>test</p></div>");
    displayPlotDevice(0);

}
//plotDevices[0] = new make([1], undefined, "Story");

plotDevices[0] = new make([1], undefined, "Event A", "#FBFFB9", "#EC7357");
plotDevices[1] = new make([2], undefined, "Event B");
plotDevices[2] = new make([3, 4], undefined, "Event C - Choose which Path to take");
plotDevices[3] = new make([5], "Path A", "Event D - Taking Path A", "#FFFFFF", "green");
plotDevices[4] = new make([6], "Path B", "Event D - Taking Path B");
plotDevices[5] = new make([7], undefined, " Event E w/ Path A (End)");
plotDevices[6] = new make([8], undefined, "Event E w/ Path B (End)");

HTML：

<!DOCTYPE html>
<html>
    <head>
        <link href="https://fonts.googleapis.com/css?family=Roboto|Ubuntu" rel="stylesheet">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
        <title>Page Title</title>
    </head>
    <body>
        <h1> Title Page </h1>
        <p onclick="start()" class="net">  Start </p>

    </body>
</html>

Javascript代码随机跳过

0 个答案: