function CopyTextToClipboard(text) {
    // 方法1: 使用現代Clipboard API（首選）
    if (navigator.clipboard && window.isSecureContext) {
        return navigator.clipboard.writeText(text)
            .then(() => {
                return true;
            })
            .catch(err => {
                return FallbackCopyTextToClipboard(text);
            });
    }
    else {
        return FallbackCopyTextToClipboard(text);
    }
}

function FallbackCopyTextToClipboard(text) {
    return new Promise((resolve, reject) => {
        const textArea = document.createElement('textarea');

        // 設置樣式確保不可見但可選中
        textArea.style.position = 'fixed';
        textArea.style.top = '0';
        textArea.style.left = '0';
        textArea.style.width = '2em';
        textArea.style.height = '2em';
        textArea.style.padding = '0';
        textArea.style.border = 'none';
        textArea.style.outline = 'none';
        textArea.style.boxShadow = 'none';
        textArea.style.background = 'transparent';
        textArea.style.opacity = '0';

        textArea.value = text;
        document.body.appendChild(textArea);

        // 選中文本
        textArea.select();
        textArea.setSelectionRange(0, textArea.value.length);

        try {
            // 嘗試執行復制命令
            const successful = document.execCommand('copy');
            document.body.removeChild(textArea);

            if (successful) {
                resolve(true);
            } else {
                reject(new Error('複製失敗'));
            }
        } catch (err) {
            document.body.removeChild(textArea);
            reject(err);
        }
    });
}

function SelectText(element) {
    // 如果元素本身是input或textarea，直接選中
    if (element.tagName === 'INPUT' || element.tagName === 'TEXTAREA') {
        element.select();
        return;
    }

    var sel, range;

    // 現代瀏覽器
    if (window.getSelection && document.createRange) {
        sel = window.getSelection();
        if (sel.toString() === '') { // 如果沒有已選中的文本
            window.setTimeout(function () {
                range = document.createRange();
                range.selectNodeContents(element);
                sel.removeAllRanges();
                sel.addRange(range);
            }, 1);
        }
    }
    // IE 8及以下
    else if (document.selection) {
        sel = document.selection.createRange();
        if (sel.text === '') {
            range = document.body.createTextRange();
            range.moveToElementText(element);
            range.select();
        }
    }
}

function CopyAndSelect(element) {
    // 獲取要複製的文本
    let textToCopy = '';

    // 根據元素類型獲取文本
    if (element.tagName === 'INPUT' || element.tagName === 'TEXTAREA') {
        textToCopy = element.value;
    } else {
        textToCopy = element.innerText || element.textContent;
    }

    // 清理文本（去除首尾空格）
    textToCopy = textToCopy.trim();

    // 如果有自定義屬性，優先使用
    if (element.dataset.copyValue) {
        textToCopy = element.dataset.copyValue;
    }

    // 複製文本到剪貼板
    CopyTextToClipboard(textToCopy).then(success => {
        if (success) {
            // 選中元素文本（視覺反饋）
            SelectText(element);

            // 可選：添加視覺反饋樣式
            element.classList.add('copied');
            setTimeout(() => {
                element.classList.remove('copied');
            }, 1000);
        }
    }).catch(err => {
        console.error('複製失敗:', err);
        // 即使複製失敗，也選中文本讓用户可以手動複製
        SelectText(element);
    });
}

 
    .click-to-copy {
        cursor: pointer;
    }

        .click-to-copy:hover {
            background-color: #f0f8ff;
            border-color: #1890ff;
        }

<h3>單擊複製示例</h3>
<table style="width:60%;">
    <tr>
        <td style="width:40%;border: 1px solid #b6ff00;">

            <!-- 示例1：普通文本 -->
            <div class="click-to-copy">
                ITEM-2026-301-663-237
            </div>

            <!-- 示例2：帶空格的文本 -->
            <div class="click-to-copy">
                ITEM 2026 301 663 237
            </div>

            <!-- 示例3：混合格式 -->
            <div class="click-to-copy">
                PO-2026/01-001-A
            </div>

            <!-- 示例4：使用自定義屬性 -->
            <div>
                顯示文本：<spcn class="click-to-copy">SPECIAL CODE 123 456</spcn>
            </div>

            <!-- 示例5：表格中的單元格 -->
            <table border="1" cellpadding="8" style="margin-top: 20px;">
                <tr>
                    <th>物料編碼</th>
                    <th>描述</th>
                </tr>
                <tr>
                    <td class="click-to-copy">MAT-001-2024</td>
                    <td>螺絲刀</td>
                </tr>
                <tr>
                    <td class="click-to-copy">MAT-002-2024</td>
                    <td>扳手</td>
                </tr>
            </table>
        </td>
        <td style="border: 1px solid #b6ff00; padding:0px;">
            <textarea id="TextArea1" cols="50" rows="12" style="border: none; width:100%;"></textarea>
        </td>
    </tr>
</table>

 $(document).ready(function () {
     $(".click-to-copy").click(function (e) {
         // 防止事件冒泡到父元素
         e.stopPropagation();

         // 獲取要複製的文本
         var textToCopy = $(this).data('copy-value') || $(this).text().trim();

         // 複製到剪貼板
         CopyTextToClipboard(textToCopy).then(function (success) {
             if (success) {
                 // 選中文本（視覺反饋）
                 SelectText(this);

                 // 添加視覺反饋
                 $(this).addClass('copied');
                 setTimeout(function () {
                     $(this).removeClass('copied');
                 }.bind(this), 1000);
             }
         }.bind(this)).catch(function (err) {
             console.error('複製失敗:', err);
             // 即使複製失敗也選中文本
             SelectText(this);
         }.bind(this));
     });
 });