Utilisez le glisser-déposer pour copier un lien hypertexte dans le presse-papiers pour le coller ailleurs
P粉419164700
P粉419164700 2024-01-16 21:38:10
0
1
426

Je n'ai aucune expérience ni connaissance en matière de codage.

J'essaie de créer une carte avec des citations pour un article de blog WordPress.

Il y a un bouton sur la carte qui permet aux utilisateurs de copier le devis directement dans le presse-papiers.

Je souhaite également copier le lien hypertexte : (Source) vers mon site internet.

J'ai exécuté ce code via GPT et réécrit. Mais à chaque fois, il copie uniquement le texte et n'essaie même pas de copier l'URL.

J'ai joint le code ci-dessous dans l'espoir que quelqu'un puisse m'aider parce que je deviens fou.

<style>
.card-box {
  max-width: 400px;
  margin: 0 auto;
  padding: 20px;
  background-color: #ffffff;
  border-radius: 8px;
  border: 2px solid #0077B5;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  text-align: center;
}

.quote {
  margin-bottom: 20px;
}

.quote p {
  font-size: 18px;
  line-height: 1.4;
  color: #333333;
}

.quote a {
  display: block;
  margin-top: 10px;
  font-size: 14px;
  color: black;
  text-decoration: none;
}

.copy-to-clipboard {
  margin-bottom: 20px;
}

.copy-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  font-size: 16px;
  line-height: 1;
  color: #ffffff;
  background-color: #0077B5;
  border: 2px solid #0077B5;
  border-radius: 4px;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.copy-btn i {
  margin-right: 5px;
}

.signature {
  margin-top: 20px;
  font-size: 12px;
  font-style: italic;
  color: #777777;
}
</style>

<div class="card-box">
  <div class="quote">
    <p id="quoteText">在这里输入您的引用或统计数据</p>
    <a id="sourceLink" href="https://www.example.com">来源</a>
  </div>
  <div class="copy-to-clipboard">
    <button class="copy-btn" onclick="copyToClipboard()"><i class="fas fa-copy"></i> 复制统计数据</button>
  </div>
  <div class="signature">
    <p>Chad Wyatt</p>
  </div>
</div>

<script>
  function copyToClipboard() {
    const quote = document.querySelector('#quoteText').textContent;
    const sourceLink = document.querySelector('#sourceLink').getAttribute('href');
    const copiedText = `引用:${quote}\n来源:${sourceLink}`;
    
    const tempTextArea = document.createElement('textarea');
    tempTextArea.value = copiedText;
    document.body.appendChild(tempTextArea);
    tempTextArea.select();
    document.execCommand('copy');
    document.body.removeChild(tempTextArea);
    
    alert('带有来源链接的引用已复制到剪贴板!');
  }
</script>

P粉419164700
P粉419164700

répondre à tous(1)
P粉269847997

J'ai essayé votre code ici https://www.w3schools.com/html/tryit.asp?filename=tryhtml_default

Fonctionne bien pour moi.

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal