テキスト入力補完のjQueryライブラリjquery.suggestを追加型にした。
http://www.vulgarisoip.com/2007/06/29/jquerysuggest-an-alternative-jquery-based-autocomplete-library/
入力補完により得られる語句はテキストに上書きされてしまう。
これを追加できるようにしてみた。
このような使い方を望むのは僕だけだろうか・・・。
jquery.suggest 1.1 – 2007-08-06
上記バージョンソースの下記を変更する。
suggest関数の先頭。
/*------------------------------ by systemconcept --------*/
/*var q = $.trim($input.val());*/
/*if (q.length >= options.minchars) {*/
var words = $.trim($input.val());
var q = (options.append)? $.trim(getLastWord(words)): words;
if (words.length >= options.minchars) {
/*--------------------------------------------------------*/
selectCurrentResult関数内。
if ($currentResult) {
/*------------------------- by systemconcept --------*/
/*$input.val($currentResult.text());*/
if (options.append)
$input.val(cutLastWord($input.val())+
$currentResult.text());
else
$input.val($currentResult.text());
/*---------------------------------------------------*/
$results.hide();
if (options.onSelect)
options.onSelect.apply($input[0]);
}
幾つか関数を追加。
/*------------------------------ by systemconcept --------*/
function cutLastWordIndex(str) {
var lastindex = -1;
var delm = options.punctuation;
for (var key in delm) {
var d = delm[key]
for (var i = str.length - 1; i >= 0; i--) {
if(str.charAt(i) == d) {
if(lastindex < i) {
lastindex = i;
break;
}
}
}
}
return lastindex;
}
function cutLastWord(str) {
var lastindex = cutLastWordIndex(str);
if(lastindex < 0) {
return "";
} else {
return str.substring(0, lastindex + 1);
}
}
function getLastWord(str) {
var lastindex = cutLastWordIndex(str);
if(lastindex < 0) {
return str;
} else {
return str.substring(lastindex + 1);
}
}
/*--------------------------------------------------------*/
jsソース末尾のパラメータ初期化部分に追加。
/*------------------------------ by systemconcept --------*/ options.append = options.append || false; options.punctuation = options.punctuation || [' ']; /*--------------------------------------------------------*/
以上で完成。
使い方は以下。
<script type="text/javascript">
jQuery(
function() {
jQuery("#mytext").suggest(
"http://localhost/listcontentsget",
{
append: true,
punctuation: [' ', ','],
}
);
}
);
</script>
<input id="mytext" type="text"></input>
パラメータのURLは補完リストの取得URL。
※jquery.suggest関連サイト参照。
append:trueは本機能を有効にする。
punctuationは語句を切り出す句読点。