やりたいこと
SpreadSheetなどに書いたデータをコピーして入力フォームに流し込みたい。
流し込みたい対象の入力フォーム
<html lang="ja">
<head>
<meta charset="utf-8">
<title>clipboard test</title>
</head>
<body>
<form action="">
<div>番号<input name="no"></div>
<div>氏名<input name="name"></div>
<div>よみ<input name="yomi"></div>
<div>誕生日<input name="birthday"></div>
</form>
</body>
</html>
コピー元データ
ブックマークレット
javascript:(function(){
navigator.clipboard.readText().then(
clipText => {
var cols = clipText.split("\t");
document.querySelector("input[name='no']").value = cols[0];
document.querySelector("input[name='name']").value = cols[1] + cols[2];
document.querySelector("input[name='yomi']").value = cols[3] + cols[4];
document.querySelector("input[name='birthday']").value = cols[5];
}
);
})()
上記を改行を消して1行にしてブックマークに保存します。
javascript:(function(){navigator.clipboard.readText().then(clipText => {var cols = clipText.split("\t");document.querySelector("input[name='no']").value = cols[0];document.querySelector("input[name='name']").value = cols[1] + cols[2];document.querySelector("input[name='yomi']").value = cols[3] + cols[4];document.querySelector("input[name='birthday']").value = cols[5]})})()
navigator.clipboard.readText()
はクリップボードへのアクセス許可が必要なので、Chromeの場合はアドレスバーの左の鍵マークを押して『サイトの設定』を開き、権限のところにある『クリップボード』を『許可』にします。(httpsじゃないと許可にできません)
コピー元データをコピーして(クリップボードにある状態にして)、保存したブックマークのボタンを押したら入力フォームにデータが入ります。