Question

我创建了一个游戏，当单击开始按钮时，它会动态删除该div元素并创建一个新元素，以显示我希望用户看到的图像。 我的目标是，当用户点击图片时，它会控制记录它点击的图像的src，以验证点击了哪个图像。我的代码有效。我的问题是，当我点击任何图像时，它无法区分图像源。

在if语句中放入一个onclick函数会不会很好？我在想...如果点击了这个源，那么控制台会记录它的来源。

//startButton onclick function//

$("#startButton").on("click", function (event) {

//when button is clicked, it removes intro-container div and everything inside//

    $(this).closest(".intro-container").remove();

//image sources//

    kevImage = 'src=assets/images/kevin-durant.png';
    lebImage = 'src=assets/images/kobe-bryant.png';
    kobImage = 'src=assets/images/lebron-james.png';
    micImage = 'src=assets/images/michael-jordan.png';

//dynamically creating new elements//

    $("#characterPage").append("<div class= intro-container>" +
        "<h1> CHOOSE YOUR BALLER" + "</h1>" +
        "<div class=image-container>" +
        "<img class = image " + kevImage + ">" + "<img class = image " + lebImage + ">" +
        "<img class = image " + kobImage + ">" + "<img class = image " + micImage + ">" +
        "</div>" +
        "</div>");

//onclick on image class

    $(".image").on("click", function (event) {

//if statement that executes only if kevImage is selected

        if (kevImage) {
            console.log('correct');
        } else {
            console.log('wrong');
        }

    });


});

Picture of my code

Answer 1

试试$(".image").attr('src') 并将结果记录在控制台中。

Answer 2

替换为：

$(".image").on("click", function (event) {

                if ($(".image").attr('src')) {
                    console.log($(this).attr('src'));
                } else {
                    console.log('wrong');
                }

            });

当我使用JQuery执行onclick功能时，如何获得正确的图像src？

2 个答案: