如何分开多个按钮的功能?

时间:2019-10-29 04:12:40

标签: javascript php button continue

我有此代码:

<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "buatsoal_db";

$connection = mysqli_connect($servername, $username, $password, $dbname);
if (!$connection){
        die("Connection Failed:".mysqli_connect_error());
    }
?>
<?php
    $sql = "SELECT * FROM buatsoal_db;";
    $query = mysqli_query($connection, $sql);
?>
<button type="button" id="start" onclick="mulai()">Mulai</button>
<?php
$i = 0;
while ($row = mysqli_fetch_array($query)) {
    if ($row['ID'] != 'S02') {
        $i++;
        ?>
            <center>
                <div class="soals" hidden>
                    <?php echo $row['SOALTXT']; ?>
                    <button type="button" class="continue" onclick="lanjut()">Lanjutkan</button>
                    <br>
                    <br>
                </div>
            </center>
        <?php
    }
    else {
        ?>
        <div id="done" hidden>
            SELESAI
        </div>
        <?php
    }
}
?>

<script>
    var counter = 1;
    var limit = <?php echo $i; ?>

    function mulai() {
        document.getElementsByClassName("soals")[0].style.display = 'block';
    }

    function lanjut() {
        if (counter !== limit) {
            document.getElementsByClassName("soals")[counter].style.display = 'block';
            counter++;
        } else {
            document.getElementById('done').style.display = 'block';
        }
    }
</script>

这段代码的输出是这样的

after button "mulai" clicked

after the first button "lanjut clicked

after either the second button "lanjut" or the second time the first button "lanjut" clicked

当您单击按钮 lanjut 时,它将显示下一个soaltxt,但是,当我单击第一个按钮 lanjut 时,它不仅显示下一个soaltxt和另一个按钮 lanjut ,还显示下一个和下一个以及“ ..下一个”。然后,我添加了一些内容一个按钮即可发挥自己的功能。

<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "buatsoal_db";

$connection = mysqli_connect($servername, $username, $password, $dbname);
if (!$connection){
        die("Connection Failed:".mysqli_connect_error());
    }
?>
<?php
    $sql = "SELECT * FROM buatsoal_db;";
    $query = mysqli_query($connection, $sql);
?>
<button type="button" id="start" onclick="mulai()">Mulai</button>
<?php
$i = 0;
$s=1;

while ($row = mysqli_fetch_array($query)) {
    if ($row['ID'] != 'S02') {
        $i++;
        ?>
            <center>
                <div class="soals" hidden>
                    <?php echo $row['SOALTXT']; ?>
                    <button type="button" class="continue" onclick="lanjut<?php echo $s; ?>()">Lanjutkan</button>
                    <br>
                    <br>
                </div>
            </center>
            <?php $s++; ?>
        <?php
    }
    else {
        ?>
        <div id="done" hidden>
            SELESAI
        </div>
        <?php
    }
}
?>

<script>
    var counter = 1;
    var limit = <?php echo $i; ?>

    function mulai() {
        document.getElementsByClassName("soals")[0].style.display = 'block';
    }

    function lanjut<?php echo $s; ?>() {
        if (counter !== limit) {
            document.getElementsByClassName("soals")[counter].style.display = 'block';
            counter++;
        } else {
            document.getElementById('done').style.display = 'block';
        }
    }
</script>

但是,原始输出无法工作,按钮“ lanjut”根本无法工作。请您告诉我为什么?

0 个答案:

没有答案