在具有唯一值的清單中建立複製連結按鈕 - PHP 和 JavaScript

Question

我正在編寫自己的 WordPress 插件，這就是為什麼某些程式碼可能看起來有點奇怪。但我的問題是使用普通的舊 PHP。

我創建了一個玩家列表，每個玩家都有一個唯一的 URL。我想在每一行/播放器上有一個“複製連結”按鈕。但我似乎無法完成這項工作。

我不想在副本上更新網站，所以我想需要使用 Ajax 之類的東西。但我沒有經驗。

我嘗試使用 JavaScript 創建它，但當我傳入連結（字串）時，它不斷打印錯誤。 它印出：「意外的標記 ':'。預期 ')' 結束參數清單。」

我已經這樣設定了我的 PHP 檔案：

<?php
// Fetching the players //

foreach($players as $player) {
    $player_email = get_post_meta($player->ID, 'email')[0];
    $player_status = get_post_meta($player->ID, 'status')[0];
    $player_link = get_permalink($player->ID);
    
    if ($player_status == 'Not completed') { array_push($not_completed_players, 'true'); }
    $return_html .= '
    <li class="players-div">
      <div class="players-text-div"> 
        <p class="players-list-p players-name"> ' . $player->post_title . ' </p>
        <p class="players-list-p players-email"> ' . $player_email . ' </p>
      </div>

      <a class="players-list-p" href="' . $player_link . '"> /' . basename($player_link) . ' </a>
      <p class="players-list-p players-email"> ' . $player_status . ' </p>

      <button type="button" onClick="copyToClipboard(' . $player_link . ')" name="copied_link" value="' . $player_link . '"> Copy link </button>
    </li>';
 }

?>

<script>
  function copyToClipboard(playerLink) {
    navigator.clipboard.writeText( playerLink );
  }
</script>

Answer 1

您應該用雙引號或單引號將 copyToClipboard 函數的參數括起來。此解決方案透過新增反斜線 (\) 來轉義 '：

copyToClipboard(\'' . $player_link . '\')

您的播放器連結可能包含 https: 並且冒號會導致錯誤訊息。