JavaScript：前方一致・後方一致・完全一致の方法

JavaScriptで文字列の前方一致、後方一致、完全一致検索を行うJavaScriptのサンプルです。indexOfは文字列の出現indexを取得しますが、文字列が見つからない場合は「-1」を返します。これを利用して判定を行うようにしています。

HTMLサンプル

比較文字列：<input id="txt1StrMatchSample" type="text" name="txt1StrMatchSample" value="abcdefg"/>
接頭辞／接尾語：<input id="txt2StrMatchSample" type="text" name="txt2StrMatchSample" value="abc"/>
前方一致検索の結果：<input id="txt3StrMatchSample" type="text" name="txt3StrMatchSample" />
後方一致検索の結果：<input id="txt4StrMatchSample" type="text" name="txt4StrMatchSample" />
完全一致検索の結果：<input id="txt5StrMatchSample" type="text" name="txt5StrMatchSample" />

比較文字列：<input id="txt1StrMatchSample" type="text" name="txt1StrMatchSample" value="abcdefg"/>

接頭辞／接尾語：<input id="txt2StrMatchSample" type="text" name="txt2StrMatchSample" value="abc"/>

前方一致検索の結果：<input id="txt3StrMatchSample" type="text" name="txt3StrMatchSample" />

後方一致検索の結果：<input id="txt4StrMatchSample" type="text" name="txt4StrMatchSample" />

完全一致検索の結果：<input id="txt5StrMatchSample" type="text" name="txt5StrMatchSample" />

JavaScriptサンプル

jQuery(function($) {
	jQuery(document).on('blur', '#txt1StrMatchSample, #txt2StrMatchSample', function(){
		var str1 = document.getElementById("txt1StrMatchSample").value;
		var str2 = document.getElementById("txt2StrMatchSample").value;
		var randamStr = getRandomStr();
		var resultFront = getStrMatchFront(str1, str2, randamStr);
		var resultRear = getStrMatchRear(str1, str2, randamStr);
		var resultAll = getStrMatchAll(str1, str2, randamStr);
		jQuery("#txt3StrMatchSample").val(resultFront);
		jQuery("#txt4StrMatchSample").val(resultRear);
		jQuery("#txt5StrMatchSample").val(resultAll);
	});
});
/*
 *ランダム文字列を取得します。
 */
function getRandomStr() {
	var result = Math.random().toString(36).slice(-8);
	return result;
}

/*
 *前方一致検索を行います。
 */
function getStrMatchFront(str1, str2, randamStr) {
	var str = randamStr + str1;
	if (str.indexOf(randamStr + str2) !== -1) {
		return "TRUE";
	} else {
		return "FALSE";
	}
}

/*
 *後方一致検索を行います。
 */
function getStrMatchRear(str1, str2, randamStr) {
	var str = str1 + randamStr;
	if (str.indexOf(str2 + randamStr) !== -1) {
		return "TRUE";
	} else {
		return "FALSE";
	}
}

/*
 *完全一致検索を行います。
 */
function getStrMatchAll(str1, str2, randamStr) {
	var str = randamStr + str1 + randamStr;
	if (str.indexOf(randamStr + str2 + randamStr) !== -1) {
		return "TRUE";
	} else {
		return "FALSE";
	}

jQuery(function($) {

jQuery(document).on('blur', '#txt1StrMatchSample, #txt2StrMatchSample', function(){

var str1 = document.getElementById("txt1StrMatchSample").value;

var str2 = document.getElementById("txt2StrMatchSample").value;

var randamStr = getRandomStr();

var resultFront = getStrMatchFront(str1, str2, randamStr);

var resultRear = getStrMatchRear(str1, str2, randamStr);

var resultAll = getStrMatchAll(str1, str2, randamStr);

jQuery("#txt3StrMatchSample").val(resultFront);

jQuery("#txt4StrMatchSample").val(resultRear);

jQuery("#txt5StrMatchSample").val(resultAll);

});

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

function getRandomStr() {

var result = Math.random().toString(36).slice(-8);

return result;

}

*前方一致検索を行います。

function getStrMatchFront(str1, str2, randamStr) {

var str = randamStr + str1;

if (str.indexOf(randamStr + str2) !== -1) {

return "TRUE";

} else {

return "FALSE";

}

*後方一致検索を行います。

function getStrMatchRear(str1, str2, randamStr) {

var str = str1 + randamStr;

if (str.indexOf(str2 + randamStr) !== -1) {

return "TRUE";

} else {

return "FALSE";

}

*完全一致検索を行います。

function getStrMatchAll(str1, str2, randamStr) {

var str = randamStr + str1 + randamStr;

if (str.indexOf(randamStr + str2 + randamStr) !== -1) {

return "TRUE";

} else {

return "FALSE";

}

実行サンプル

比較文字列：
接頭辞／接尾語：
前方一致検索の結果：
後方一致検索の結果：
完全一致検索の結果：

日	月	火	水	木	金	土
	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