対象の子要素を選択状態にしてクリップボードへコピー

対象の子要素を選択状態にしてクリップボードへコピーするには、次の方法で可能です。

JavaScript

/**
 * 子要素を選択してクリップボードへコピー
 * @param {Element} parentElem コピーする要素の親要素
 * @return {boolean} コピーに成功した場合はtrue、失敗した場合はfalseを返す
 */
var copyChildrenElementToClipboard = function(parentElem) {
	// ユーザーの選択状態を得る
	var selection = document.getSelection();

	// 対象子要素を選択状態にする
	selection.selectAllChildren(parentElem);

	// クリップボードへコピー
	var result = document.execCommand('copy');

	// 選択を解除
	selection.removeAllRanges();

	return result;
};

JavaScript

var sampleElem  = document.getElementById('sample'),
    copyBtnElem = document.getElementById('copy');

copyBtnElem.addEventListener('click', function() {
	var result = copyElementToClipboard(sampleElem);

	if (result) {
		alert('コピーに成功');
	} else {
		alert('コピーに失敗');
	}
});

JavaScript逆引きリファレンス一覧へ戻る