Convertir un <span>'texte dans un lien hypertexte
Mise à JOUR:
Réponse #3 a fini par travailler le mieux. J'ai probablement fait quelque chose de mal avec les autres suggestions; #3 était peut-être le plus facile à mettre en œuvre. Si vous êtes curieux, l'exemple des solutions que j'ai essayé peut être trouvé ici (pour l'instant):
- http://dl.dropbox.com/u/1007716/spanToUrl/test01.html
- http://dl.dropbox.com/u/1007716/spanToUrl/test02.html
- http://dl.dropbox.com/u/1007716/spanToUrl/test03.html (gagnant)
- http://dl.dropbox.com/u/1007716/spanToUrl/test04.html
- http://dl.dropbox.com/u/1007716/spanToUrl/test05.html
- http://dl.dropbox.com/u/1007716/spanToUrl/test06.html
ORIGINAL POST:
J'ai un texte en clair l'adresse du site web à l'intérieur d'un <span>
tag. Je voudrais changer cela <span> tag dans un lien hypertexte avec target="_blank"
J'ai mis en place un exemple détaillé de ce que j'ai à travailler avec ici: http://bit.ly/spantourl
Si vous ne voulez pas cliquer dessus, voici ce que j'ai:
<span>http://www.domain.com/about</span>
et j'ai besoin de le changer en:
<a href="http://www.domain.com/about" target="_blank">http://www.domain.com/about</a>
Pouvez-vous ajouter une classe à l'échelle de sortie?
non, mais je peux envelopper l'échelle de sortie dans une autre plage avec une classe de sorte qu'il serait <span class="maclasse"><span>pas besoin pour les classes/id - utiliser une boucle for-each sur l'élément spécifique
non, mais je peux envelopper l'échelle de sortie dans une autre plage avec une classe de sorte qu'il serait <span class="maclasse"><span>pas besoin pour les classes/id - utiliser une boucle for-each sur l'élément spécifique
OriginalL'auteur ox4dboy | 2011-03-07
Vous devez vous connecter pour publier un commentaire.
Essayez ceci:
Il n'y a pas besoin de
each
, depuis remplaceavec pouvez parcourir par le biais de multiples éléments et peut prendre une fonction comme paramètre.Regardant votre exemple de code HTML, je vois que c'est seulement le premier
<td>
qui contient une URL. S'il y a bien un seul, vous pouvez ajouterfirst()
à la chaîne de sélecteur, comme ceci:Si c'est plutôt l'ensemble de la colonne qui contient des liens, que vous aurez envie de fonctionner sur tous les autres match. Faire cela en ajoutant
:even
à votre sélecteur, comme ceci:(Oui,
:even
et pas:odd
pour sélectionner la 1ère, 3ème, &c. les éléments, en raison de 0 basée sur l'indexation.)Hey, merci pour la bonne humeur. Je suis d'accord: le fait de voir plusieurs implémentations side-by-side est l'une des meilleures choses à propos de ce site.
Aussi a pris un coup à ce qu'un, ici: dl.dropbox.com/u/1007716/spanToUrl/test03.html Pas de chance pour que le travail soit.
Vous n'êtes pas de placer le code avant le HTML, et donc $('.sampleClass span') retourne un ensemble vide, puisque les éléments que vous recherchez n'existe pas encore. Essayez de déplacer ce bloc de script à la fin de la balise BODY.
oups, OK, prendre une autre photo avec un script en bas de la page. Merci pour la recherche - ce qui va probablement de résoudre les autres je m'éclate trop.
OriginalL'auteur Ori
Vous avez besoin d'avoir une certaine forme d'identité pour faire la conversion à partir d'Un nœud à nœud B. je suggère quelque chose le long des lignes suivantes:
Le JQuery code:
Le code HTML:
Le code ci-dessus n'est pas testé, mais devrait, espérons-le vous conduire dans la bonne direction.
.replaceWith()
peut itérer sur un ensemble, donc il n'y a pas besoin de l'envelopper danseach
. Voir ma réponse.Faites un jsfiddle pour elle jsfiddle.net/GyK3q
A pris un tir ici: dl.dropbox.com/u/1007716/spanToUrl/test01.html Pas de chance à la faire fonctionner sur ma page, même si elle a travaillé sur jsfiddle, ici: jsfiddle.net/GyK3q
OriginalL'auteur Simon H
Utiliser jQuery.
donner l'span id:
jQuery code:
A fonctionné pour moi...
OriginalL'auteur Rob Lee
Mettre la durée d'un identifiant et puis vous pouvez faire quelque chose comme
De changer selon votre modifier
Voir un travail démo
comment je l'aurais fait.
OriginalL'auteur rahul
Peut-être quelque chose comme ceci: (pas besoin de savoir ids/classes) en utilisant les jquerys pour chaque boucle et en particulier la cible s'étend à l'intérieur de tds
$(document).ready(function(){
$('td span').each(function(){
$(this).texte("" +
$(this).text() + "");
});
});
EDIT:ce code fonctionne beaucoup mieux:
L'original utilisé le
.text()
fonction de jquery html échappé à la<>
personnages, involontairement addin> <
dans les dom, alors que .html des sorties les bonnes balisesje double imbriquée et modifié le script pour refléter la double durée, et il est proche de travail, mais le résultat n'est pas tout à fait droit. Les guillemets simples semblent avoir besoin d'être des guillemets pour que cela fonctionne. Voir ici: dl.dropbox.com/u/1007716/spanToUrl/test02.html
Merveilleux, heureux de voir ses proches à travailler pour vous! Chaque fois que vous ne l'obtenez à travailler, ne pas oublier de marquer comme réponse que jamais de réponse m'a le plus aidée!
Réponse marquée, pris quelques tests afin de déterminer qui était le meilleur. La modification de code ci-dessus n'a trop de travail, mais il produit un code HTML non valide. L'exemple peut être vu ici: dl.dropbox.com/u/1007716/spanToUrl/test06.html
OriginalL'auteur Michael Jasper