JavaScript：ランダム文字列の生成方法

JavaScriptでランダム文字列を生成するサンプルプログラムをご紹介します。
サンプルコードでは数字、英小文字、英大文字のいずれかから指定した桁数分のランダム文字列を生成して表示します。
ちなみにイベントのハンドリングについてはjQueryで行っています。

HTMLサンプル

<fieldset align="left">
<legend align="left">生成条件</legend>
桁数：<input id="txt1CreateRandomSample" type="text" name="txt1CreateRandomSample" value="8"/><br />
<input id="chkNumCreateRandomSample" checked type="checkbox" name="chkNumCreateRandomSample" value="数字">数字<br />
<input id="chkAlpLowCreateRandomSample" checked type="checkbox" name="chkAlpLowCreateRandomSample" value="英小文字">英小文字<br />
<input id="chkAlpUprCreateRandomSample" checked type="checkbox" name="chkAlpUprCreateRandomSample" value="英大文字">英大文字
</fieldset><br />
ランダム文字列：<input id="txt2CreateRandomSample" type="text" name="txt2CreateRandomSample"/>
<button id="btn1CreateRandomSample" type="button" name="btn1CreateRandomSample">生成</button>

桁数：<input id="txt1CreateRandomSample" type="text" name="txt1CreateRandomSample" value="8"/><br />

<input id="chkAlpUprCreateRandomSample" checked type="checkbox" name="chkAlpUprCreateRandomSample" value="英大文字">英大文字

</fieldset><br />

ランダム文字列：<input id="txt2CreateRandomSample" type="text" name="txt2CreateRandomSample"/>

JavaScriptサンプル

jQuery(function($) {
	jQuery(document).on("click", "#btn1CreateRandomSample", function(){
		var length = document.getElementById("txt1CreateRandomSample").value;
		var randamStr = getRandomStr(length);
		document.getElementById("txt2CreateRandomSample").value = randamStr;
	});
});

/*
 *ランダム文字列を取得します。
 */
function getRandomStr(length) {
	// ベース文字列条件判定
	var ram = 0;
	var result = "";
	var baseStr = "";
	if(document.getElementById("chkNumCreateRandomSample").checked) {
		baseStr += "0123456789";
		ram += 10;
	}
	if(document.getElementById("chkAlpLowCreateRandomSample").checked) {
		baseStr += "abcdefghijklmnopqrstuvwxyz";
		ram += 26;
	}
	if(document.getElementById("chkAlpUprCreateRandomSample").checked) {
		baseStr += "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
		ram += 26;
	}

	// ランダム文字列生成
	for(var i=0; i<length; i++) {
		result += baseStr.charAt(Math.floor(Math.random() * ram));
	}
	return result;
}

jQuery(function($) {

jQuery(document).on("click", "#btn1CreateRandomSample", function(){

var length = document.getElementById("txt1CreateRandomSample").value;

var randamStr = getRandomStr(length);

document.getElementById("txt2CreateRandomSample").value = randamStr;

});

*ランダム文字列を取得します。

function getRandomStr(length) {

// ベース文字列条件判定

var ram = 0;

var result = "";

var baseStr = "";

if(document.getElementById("chkNumCreateRandomSample").checked) {

baseStr += "0123456789";

ram += 10;

}

if(document.getElementById("chkAlpLowCreateRandomSample").checked) {

baseStr += "abcdefghijklmnopqrstuvwxyz";

ram += 26;

}

if(document.getElementById("chkAlpUprCreateRandomSample").checked) {

baseStr += "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

ram += 26;

}

// ランダム文字列生成

for(var i=0; i<length; i++) {

result += baseStr.charAt(Math.floor(Math.random() * ram));

}

return result;

}

実行サンプル

生成条件

桁数：
数字
英小文字
英大文字

ランダム文字列：

日	月	火	水	木	金	土
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30

「駑馬十駕」を信念に IT系情報を中心に調べた事をコツコツ綴っています。

JavaScript：ランダム文字列の生成方法

HTMLサンプル

JavaScriptサンプル

実行サンプル

Ads by Google