单击按钮时动画文本区域

Question

我是 javascript 的新手，我确实在为一个问题而苦苦挣扎。我在弹出窗口中有一个文本区域（使用 JQM），它在单击按钮时更新文本。它更新的文本是从数组中随机选择的。我想做的是在文本区域或文本本身更新时添加一些动画，因为有时随机选择的文本与其中的内容相同，看起来好像什么都没发生…… 我希望这是有道理的。我拥有的 javascript 代码（并且与动画分开工作）是：希望可以有人帮帮我… 谢谢

函数 playName() {

var player = [];
var x = document.getElementById("playerName");

player.push(document.getElementById("player1").value);
player.push(document.getElementById("player2").value);

var i = document.forms["playerForm"]["player1"].value;
var ii = document.forms["playerForm"]["player2"].value;
    if (i == null || i == "") {
    alert("Please enter a name for player 1");
    return false;

    } else {

        if(ii == null || ii == ""){
        alert("Please enter a name for player 2");
        return false;

        } else {

            var randomName = player[Math.floor(Math.random()*player.length)]            
            document.getElementById("playerName").innerHTML = randomName;

        }

    }

}

Answer 1

您可以使用 click 事件和 animate 来执行此操作，例如：

$("#yourButton").click(function(){
    $("textarea").fadeOut().fadeIn(2000);
});

在 jQuery API 文档中查看更多相关信息： http://api.jquery.com/animate/

你也可以check this JSFiddle for an example

单击按钮时动画文本区域

Animate textarea when button clicked

html

javascript

jquery-mobile