Question

这对我来说是一个重要的项目，我一直试图找到一种方法来防止文本一遍又一遍地附加到body。每次按下右箭头或向上箭头键时，我都会出现不同的幻灯片。点击 ＆＃39; 后，暂停幻灯片，您将看到正文背景图片 。使用append()函数我正在向图像添加文本。不幸的是，当您暂停或播放时，文本会不断添加。到目前为止，我尝试使用hide()，fadeOut()，one()甚至dequeue()来阻止它，但没有成功。如何将文本附加到正文一次？ fadeToggle()功能正常显示和隐藏正文背景图像只有文本导致问题

  $(document).keyup(function(event) {
        var text = $("<p.text>PRESS 'P' TO GO BACK</p.text>");
        if(event.keyCode == 39 || event.keyCode == 40 ||   event.keyCode == 32) {
        next(); // right arrow and bottom arrow keys
        }
        else if(event.keyCode == 37 || event.keyCode == 38){
        back(); // left arrow and up arrow keys
        }
        else if(event.keyCode == 80){  // 'p' key to pause and play 
            $('.slides').fadeToggle();
            $('body').append(text).hide();
        }
    });

CSS：

   body {
    font-size: 2.5em;
    background: url("bodyBack.png");
}

这不是一个完整的代码

Answer 1

试试这个..让我知道你需要与否

var notappend = true;
     $(document).keyup(function(event) {
            var text = $("<p.text>PRESS 'P' TO GO BACK</p.text>");
            if(event.keyCode == 39 || event.keyCode == 40 ||   event.keyCode == 32) {
            next(); // right arrow and bottom arrow keys
            }
            else if(event.keyCode == 37 || event.keyCode == 38){
            back(); // left arrow and up arrow keys
            }
            else if(event.keyCode == 80){  // 'p' key to pause and play
                $('.slides').fadeToggle(); 
                if(notappend == true){
                    $('body').append(text);
                    notappend = false;
                }else{
                    //notappend == true;
                }

            }
        });

尝试解决notappend == true;并且notappend == false;得到你想要的东西

使用fadeToggle（）效果将文本附加到正文背景图像

1 个答案: