フリガナ自動変換 漢字→カタカナに変換したい
Q&A
Closed
解決したいこと
漢字を入力した際、自動でカタカナに変換できるようにしたいです。
こちらの記事を参考に、フリガナを自動変換したいのですが、以下のコードをどの部分に
書いたら良いかわかりません
「return katakana ? katakanaMap[input] || '' : hiraganaMap[input] || '';」を無視して
サイトを作りましたが、ひらがなを入力したら変換はできましたが、漢字を入力しても変換されません。
以下の記事のデモサイトでは、漢字でも変換されるので、コードが誤っていると存じます。
ご教示いただけますと幸いです。
発生している問題・エラー
return katakana ? katakanaMap[input] || '' : hiraganaMap[input] || '';
hiraganaMap.js
const hiraganaMap = {
'a': 'あ', 'i': 'い', 'u': 'う', 'e': 'え', 'o': 'お',
'ka': 'か', 'ki': 'き', 'ku': 'く', 'ke': 'け', 'ko': 'こ',
'sa': 'さ', 'si': 'し', 'su': 'す', 'se': 'せ', 'so': 'そ',
'ta': 'た', 'ti': 'ち', 'tu': 'つ', 'te': 'て', 'to': 'と',
'na': 'な', 'ni': 'に', 'nu': 'ぬ', 'ne': 'ね', 'no': 'の',
'ha': 'は', 'hi': 'ひ', 'fu': 'ふ', 'he': 'へ', 'ho': 'ほ',
'ma': 'ま', 'mi': 'み', 'mu': 'む', 'me': 'め', 'mo': 'も',
'ya': 'や', 'yu': 'ゆ', 'yo': 'よ',
'ra': 'ら', 'ri': 'り', 'ru': 'る', 're': 'れ', 'ro': 'ろ',
'wa': 'わ', 'wo': 'を', 'n': 'ん'
};
katakanaMap.js
const katakanaMap = {
'a': 'ア', 'i': 'イ', 'u': 'ウ', 'e': 'エ', 'o': 'オ',
'ka': 'カ', 'ki': 'キ', 'ku': 'ク', 'ke': 'ケ', 'ko': 'コ',
'sa': 'サ', 'si': 'シ', 'su': 'ス', 'se': 'セ', 'so': 'ソ',
'ta': 'タ', 'ti': 'チ', 'tu': 'ツ', 'te': 'テ', 'to': 'ト',
'na': 'ナ', 'ni': 'ニ', 'nu': 'ヌ', 'ne': 'ネ', 'no': 'ノ',
'ha': 'ハ', 'hi': 'ヒ', 'fu': 'フ', 'he': 'ヘ', 'ho': 'ホ',
'ma': 'マ', 'mi': 'ミ', 'mu': 'ム', 'me': 'メ', 'mo': 'モ',
'ya': 'ヤ', 'yu': 'ユ', 'yo': 'ヨ',
'ra': 'ラ', 'ri': 'リ', 'ru': 'ル', 're': 'レ', 'ro': 'ロ',
'wa': 'ワ', 'wo': 'ヲ', 'n': 'ン'
};
jquery.autoKana.js(GithubからDLしたもの)
// Copyright (c) 2013 Keith Perhac @ DelfiNet (http://delfi-net.com)
//
// Based on the AutoRuby library created by:
// Copyright (c) 2005-2008 spinelz.org (http://script.spinelz.org/)
//
// Permission is hereby granted, free of charge, to any person obtaining
// a copy of this software and associated documentation files (the
// "Software"), to deal in the Software without restriction, including
// without limitation the rights to use, copy, modify, merge, publish,
// distribute, sublicense, and/or sell copies of the Software, and to
// permit persons to whom the Software is furnished to do so, subject to
// the following conditions:
//
// The above copyright notice and this permission notice shall be
// included in all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
// EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
// NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
// LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
// OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
// WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
(function ($) {
$.fn.autoKana = function (element1, element2, passedOptions) {
var options = $.extend(
{
'katakana': false
}, passedOptions);
var kana_extraction_pattern = new RegExp('[^ ぁあ-んー]', 'g');
var kana_compacting_pattern = new RegExp('[ぁぃぅぇぉっゃゅょ]', 'g');
var elName,
elKana,
active = false,
timer = null,
flagConvert = true,
input,
values,
ignoreString,
baseKana;
elName = $(element1);
elKana = $(element2);
active = true;
_stateClear();
elName.blur(_eventBlur);
elName.focus(_eventFocus);
elName.keydown(_eventKeyDown);
function start() {
active = true;
};
function stop() {
active = false;
};
function toggle(event) {
var ev = event || window.event;
if (event) {
var el = Event.element(event);
if (el.checked) {
active = true;
} else {
active = false;
}
} else {
active = !active;
}
};
function _checkConvert(new_values) {
if (!flagConvert) {
if (Math.abs(values.length - new_values.length) > 1) {
var tmp_values = new_values.join('').replace(kana_compacting_pattern, '').split('');
if (Math.abs(values.length - tmp_values.length) > 1) {
_stateConvert();
}
} else {
if (values.length == input.length && values.join('') != input) {
if (input.match(kana_extraction_pattern)) {
_stateConvert();
}
}
}
}
};
function _checkValue() {
var new_input, new_values;
new_input = elName.val()
if (new_input == '' && elKana.val() != '') {
_stateClear();
_setKana();
} else {
new_input = _removeString(new_input);
if (input == new_input) {
return;
} else {
input = new_input;
if (!flagConvert) {
new_values = new_input.replace(kana_extraction_pattern, '').split('');
_checkConvert(new_values);
_setKana(new_values);
}
}
}
};
function _clearInterval() {
clearInterval(timer);
};
function _eventBlur(event) {
_clearInterval();
};
function _eventFocus(event) {
_stateInput();
_setInterval();
};
function _eventKeyDown(event) {
if (flagConvert) {
_stateInput();
}
};
function _isHiragana(chara) {
return ((chara >= 12353 && chara <= 12435) || chara == 12445 || chara == 12446);
};
function _removeString(new_input) {
if (new_input.indexOf(ignoreString) !== -1) {
return new_input.replace(ignoreString, '');
} else {
var i, ignoreArray, inputArray;
ignoreArray = ignoreString.split('');
inputArray = new_input.split('');
for (i = 0; i < ignoreArray.length; i++) {
if (ignoreArray[i] == inputArray[i]) {
inputArray[i] = '';
}
}
return inputArray.join('');
}
};
function _setInterval() {
var self = this;
timer = setInterval(_checkValue, 30);
};
function _setKana(new_values) {
if (!flagConvert) {
if (new_values) {
values = new_values;
}
if (active) {
var _val = _toKatakana(baseKana + values.join(''));
elKana.val(_val).change();
}
}
};
function _stateClear() {
baseKana = '';
flagConvert = false;
ignoreString = '';
input = '';
values = [];
};
function _stateInput() {
baseKana = elKana.val();
flagConvert = false;
ignoreString = elName.val();
};
function _stateConvert() {
baseKana = baseKana + values.join('');
flagConvert = true;
values = [];
};
function _toKatakana(src) {
if (options.katakana) {
var c, i, str;
str = new String;
for (i = 0; i < src.length; i++) {
c = src.charCodeAt(i);
if (_isHiragana(c)) {
str += String.fromCharCode(c + 96);
} else {
str += src.charAt(i);
}
}
return str;
} else {
return src;
}
}
};
})(jQuery);
vite.config.js
import { defineConfig } from 'vite';
export default defineConfig({
build: {
rollupOptions: {
input: 'src/jquery.autoKana.js',
output: {
entryFileNames: 'jquery.autoKana.min.js',
}
},
outDir: 'dist',
emptyOutDir: true,
minify: true
}
});
0 likes