Question

我想在点击按钮时给出眨眼效果（黑暗和浅色）。我已经写了下面的代码但它不起作用。所以请帮助我。

$(document).ready(function () {

    $(".search").click(function () {
        setInterval(function () {
            var curSrc = $("#red").attr('src');

            if (curSrc === '../images/lightred.jpg') {
                $(curSrc).attr("src", "../images/Darkred.jpg");
            }
            if (curSrc === '../images/Darkred.jpg') {
                $(curSrc).attr("src", "../images/lightred.jpg");
            }
        }, 2000);
    });

});

Answer 1

curSrc是你的源属性，但是你试图将它包装在jQuery中，这不会使它成为一个对象。您必须再次定位#red，然后设置来源：

if (curSrc === '../images/lightred.jpg') {
            $("#red").attr("src", "../images/Darkred.jpg");
}
if (curSrc === '../images/Darkred.jpg') {
            $("#red").attr("src", "../images/lightred.jpg");
}

Answer 2

似乎问题可能是如何使按钮闪烁。这可以使用css background-color属性来完成。假设lightRed和darkRed是纯色，CSS更合适。如果需要图像，则可以使用background-image属性。

<input type="button" class="search lightRed" value="Search"/>
<style>
    .lightRed { background-color: lightcoral }
    .darkRed { background-color: darkRed }
</style>
<script>
    $(document).ready(function(){
        $(".search").click(function(){
            setInterval(function(){
                var isLightRed = $(".search").hasClass("lightRed");
                if (isLightRed) {
                    $(".search").removeClass("lightRed").addClass("darkRed");
                } else {
                    $(".search").removeClass("darkRed").addClass("lightRed");
                }
            },2000);
        });
    });
</script>

单击按钮时setInterval + image src更改

2 个答案: