URLごとにデフォルトネームを設定する名前変換JavaScript
スクリプトひとつをてがろぐに導入して名前変換したいのだわ〜〜と作ったやつです。
また今度真面目に解説します。
$(function(){
var dflt = {
'名前1': '苗字',
'名前2': '名前'
};
var queryParams = new URLSearchParams(window.location.search);
if (window.location.pathname.includes('novel')) {
dflt = {
'名前1': 'デフォ1',
'名前2': 'デフォ2'
};
} else if (window.location.pathname.includes('form')) {
dflt = {
'名前1': 'ノワール',
'名前2': 'アリス'
};
}
var $set = $('#changeSet');
var $clr = $('#changeClr');
var $area = $('body');
var storage = sessionStorage;
var path = 'textchanger';
var data = JSON.parse( storage.getItem(path) );
if( $.type(data)!='object' ) data={};
$.each(dflt,function(k,v){
var txt = data[k]||v;
var $tgt = $area.wrapText(RegExp('-'+k+'-','g')).text(txt);
var $inpt = $('input[data-text="'+k+'"]').val(txt);
if( !$inpt.length ) return true;
$set.on('click',function(){
data[k] = $inpt.val();
$tgt.text(data[k]);
});
$clr.on('click',function(){
delete data[k];
$tgt.text(v);
$inpt.val(v);
});
});
$set.on('click',function(){
storage.setItem(path, JSON.stringify(data) );
});
$clr.on('click',function(){
var s = JSON.stringify(data);
if(s.length<3) storage.removeItem(path);
else storage.setItem(path,s);
});
});
(function( $ ){
$.fn.replaceText = function(pattern,replacement,nofollow) {
var $not = this.find(nofollow||'script,style').find('*').addBack();
this.find('*').addBack().not($not).contents().each(function(){
if( this.nodeType != 3 ) return true;
var str = htmlEsc( $(this).text() );
if( !str.match(pattern) ) return true;
$(this).replaceWith( str.replace(pattern,replacement) );
});
return this;
function htmlEsc(str){
return str.replace(/[&<>'"`]/g, function(s){ return '&#'+s.charCodeAt(0)+';'; });
}
};
$.fn.wrapText = function(pattern,tagname,nofollow) {
var pattern = pattern || /&#\d+;|\S/g;
var tagname = tagname || 'span';
var $adv = this.find(tagname);
return this.replaceText(pattern,'<'+tagname+'>$&',nofollow).find(tagname).not($adv);
};
})( jQuery );
英語と日本語の切り替えをするJavaScript
タイトルのスクリプトの配布です。
実際にinfoページで使っています。Twitterの個人サイト向けハッシュタグで設定しているサイトを見かけて「いいな〜〜！」と言ったために作りました。 今の所infoページのみです。
中身まで翻訳作業してると時間がいくつあっても足りないし自分の昔の文章は拙すぎて訳すのが苦痛。
クッキーで設定を保存しています。管理が楽なので30日にしています。
デモページ
https://nanos.jp/ya10co/page/10/
以下、スクリプト
日本語で表示させるときには
id="ja-text"
を設定してください。
英語で表示させる時には
id="en-text" style="display:none;" を設定してください。
（通常時は日本語表示、ボタンを押すと英語表示に切り替えます。）
ボタンはこう
わたしはフッター部分にFont Awesomeのアイコンを設定してつけてます。CSSでいい感じにデザインしてね。
あと、CSSで
#en-text に{word-break: normal;}を設定してあげると、英単語がへんなところで改行されなくなります。
これは日本語に特には効果がないので別に限定的な適用じゃなくともいいとは思うのですが……。まあ、念の為に。