在点击时改变文字并不断变化

我有div的“嘿”。这改变为“你还好吗？”当我点击它。但我想争取更多的文本。我怎样才能让这个当我点击了“你还好吗”另一个文本出现，等等...在点击时改变文字并不断变化

HTML：

$(document).ready(function() { 
 
    $("#fold").click(function() { 
 
     $("#fold_p").text("Are you ok?"); 
 
    }) 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p><div id="fold"> 
 
    <p id="fold_p">Hey</p> 
 
</div>

此外，是否有可能使最后的文本链接？任何帮助深表感谢。谢谢

来源

2017-04-13 Papermm PerSecond

你可以在每一次点击... ** **举例https://jsfiddle.net/b0vjgny9/ – NewToJS

创建消息数组通过持有一个数组和循环文本。每次单击时，将数组中的下一条消息放入文本中。 – Barmar

你想让它无限循环吗？ –

我们可以在jQuery以及在JavaScript实现这两个功能。

单击上一个显示的文本时动态文本更改。
最后文本为纽带

使用JavaScript

var text = ["First","Second","Third","Fourth"] 
 

 
var index = 0; 
 
document.getElementById("fold").onclick = function() { 
 
    index++; 
 
    if(index < text.length) { 
 
    if(index == text.length-1) { 
 
    document.getElementById("fold_p").innerHTML = '<a href="">'+text[index]+'</a>'; 
 
    } else { 
 
    document.getElementById("fold_p").innerHTML = text[index]; 
 
    } 
 
    } 
 
}

<div id="fold"> 
 
    <p id="fold_p">Hey</p> 
 
</div>

使用jQuery

var text = ["First","Second","Third","Fourth"] 
 

 
var index = 0; 
 
$("#fold").click(function() { 
 
    index++; 
 
    if(index < text.length) { 
 
    if(index == text.length-1) { 
 
    $("#fold_p").html('<a href="">'+text[index]+'</a>'); 
 
    } else { 
 
    $("#fold_p").text(text[index]); 
 
    } 
 
    } 
 
})

<div id="fold"> 
 
    <p id="fold_p">Hey</p> 
 
</div>

来源

2017-04-13 05:07:30

谢谢，你真的帮了我。但我仍然对作为链接的最后一个词感到困惑。对不起，我很新的HTML和朋友，我用它的工作 –

你问你的问题如何使最后一段文字作为一个链接。所以我也回答了这个问题。 –

是的，我知道。我仍然不知道它是如何工作的。 imake如何转到外部页面。 –

在这里，你去！只需创建一个数组就像评论中所述！

var text = ["Hi","One","Two","Three","Four"] 
 

 
$(document).ready(function() { 
 
    var index = 0; 
 
    $("#fold").click(function() { 
 
     index++; 
 
     $("#fold_p").text(text[index]); 
 
    }) 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p><div id="fold"> 
 
    <p id="fold_p">Hey</p> 
 
</div>

来源

2017-04-13 00:11:37 Felix

非常感谢您的反馈。我要试试 –

我最好使用一个数组，然后以具有不同的导语吐出阵列偏移。

$(document).ready(function() { 
 
    textList = ["Are you okay?", "Well that's cool.", "I like puppies"]; 
 
    $("#fold").click(function() { 
 
    $("#fold_p").text(textList.shift()); 
 
    }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p><div id="fold"> 
 
    <p id="fold_p">Hey</p> 
 
</div>

来源

2017-04-13 00:12:44 Neil

在点击时改变文字并不断变化

回答

相关问题