javascript - 如何创建随机字符串JS

标签 javascript jquery html css

下面的代码创建了 10 个随机字符串,想法是让每个字符串都在一个“li”中。凭借我所拥有的,我能够创建 10 个随机“li”,但在第二个“li”之后,它是一个新字符串,但与前一个字符串相同。有没有办法来解决这个问题?

例如:这就是我想要得到的

字符串 1

字符串 2

字符串 3

.......

我目前得到的输出是

字符串 1

字符串 1 字符串 2

字符串 1 字符串 2 字符串 3

.....

演示:https://jsfiddle.net/73cmb11q/

function names()
{
	var txt = "abcdefghiklmnopqrstuvwxyz";
	var name_length = 8;
	var randomName = '';
    
    var randomLength = Math.trunc(Math.random() * (8 - 4) + 4); 
    console.log(randomLength);

    for(var j=0; j<10; j++)
    {
    	var randomLength = Math.trunc(Math.random() * (8 - 4) + 4); 
    	for(var i=0; i<randomLength; i++)
		{
			var rname = Math.floor(Math.random() * txt.length);
			randomName += txt.substring(rname, rname+1);
		} 
		var divName = document.getElementById('names');
	    divName.innerHTML += '<li>' + randomName + '</li>';
	}

	
}
<form name="randomform">
  <input type="button" value="Create" onClick="names()">
  <input type="text" name="randomfield">
</form>

<ul id="names">
</ul>

最佳答案

你可以在每次追加一个li后将字符串重置为“”,这样下次就会形成一个新的字符串,你需要在将innerHTML添加到你的div时使用+=,否则你会只有一个列表,因为您不断替换以前的列表。

function names()
{
	var txt = "abcdefghiklmnopqrstuvwxyz";
	var name_length = 8;
	var randomName = '';
    
    var randomLength = Math.trunc(Math.random() * (8 - 4) + 4); 
    console.log(randomLength);

    for(var j=0; j<10; j++)
    {
    	var randomLength = Math.trunc(Math.random() * (8 - 4) + 4); 
    	for(var i=0; i<randomLength; i++)
		{
			var rname = Math.floor(Math.random() * txt.length);
			randomName += txt.substring(rname, rname+1);
		} 
		var divName = document.getElementById('names');
	    divName.innerHTML += '<li>' + randomName + '</li>';
                    randomName = "";
	}

	
}
<form name="randomform">
  <input type="button" value="Create" onClick="names()">
  <input type="text" name="randomfield">
</form>

<ul id="names">
</ul>

关于javascript - 如何创建随机字符串JS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45396238/

相关文章:

javascript - 为什么 React 中渲染元素的函数中 DOM 方法的行为是不确定的?

javascript - 使用下拉列表过滤后如何保留多选框中的选定值

javascript - 如何将 JSON 数据保存到 JavaScript 中的变量

jquery - 如何在 simplyScroll 中实现不等宽的图像元素?

jquery - 将完整日历右标题从按钮更改为列表项

javascript - 使用 Google 文档/表格中的代码

Javascript:从 Font Awesome 获取符号 unicode

javascript - 防止 jQuery UI 对话框将焦点设置到第一个文本框

javascript - 在初始按钮单击时从 html 图像转换为 png 图像

javascript - jquery - .mouseover 功能并不总是适用于移动设备