Saya menggunakan bootstrap dan jQuery. Saya memiliki 4 gambar dan saya hanya ingin satu ditampilkan secara acak setiap kali seseorang menekan tombol. Apa yang saya coba adalah membuat array gambar dan kemudian menggunakan tombol untuk memanggil fungsi tetapi tidak berfungsi. Tahu apa yang saya lakukan salah?

Ini tombolnya

<div class="container-fluid">
    <div class="row">
        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 text-center">
            <button id="button" type="button" class="btn btn-primary">New Photo</button>
        </div>
    </div>
</div>

Di sinilah saya ingin gambarnya ditampilkan

<div class="container-fluid">
    <div class="row">
        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 text-center">
            <img id="picture">
        </div>
    </div>
</div>

Ini skrip saya my

<script>
    $(document).ready(function() {
        $("#button").click(function() {
            displayPics();
        });
    });


    function displayPics() {

        var imagesArray = new Array();

        imagesArray = [
            "CM.jpg", "DC.jpg", "MG.jpg", "SW.jpg"
        ]

        var num = Math.floor(Math.random() * (imagesArray.length + 1));
        var img = imagesArray[num];

        $("picture").html("<img src='" + img + "' />")
    }

    window.onload = init;
</script>
0
MarcoPolo 25 Oktober 2019, 03:28

1 menjawab

$("picture").html("<img src='" + img + "' />");
$("#picture").attr('src',img);

Anda kehilangan pemilih html.

-1
garam hyeon 25 Oktober 2019, 00:34