11540 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous !

Je galère depuis un moment sur une opération toute simple :
j'aimerais pouvoir changer du texte par un simple click de souris.

après des recherches, il me semble que la fonction onClick est la plus pertinente, le hic c'est que je n'ai que très peu de connaissances en javascript et je bloque sur le script.

voilà où j'en suis pour l'instant :

<div id="passerIntro">

	<a href="#"  onclick="changer()">Message par defaut</a>

	<script type="text/javascript">
	function changer() {
	document.getElementById('passerIntro').innerHTML = 'Mon nouveau message';
	}
	</script>

</div>


et ça ne marche pas !
merci de rectifier cette tentative maladroite ou de m'orienter sur une autre méthode

Bien à vous et bonne continuation
bonjour,

je pense que déjà tu ne cibles pas le bon élément. tu cherches à changer le texte de la balise <a> pas du <div>.

sinon tout dépend de tes besoins, mais si tu comptes utiliser une "couche" javascript pour ton site je te conseille une librairie de type jQuery qui propose des fonctions et méthodes dédiées et simples.
Salut,

Le texte entre <span> et </span> stylé ferait mieux l'affaire qu'un lien.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Test</title>

		<style type="text/css">
			#message{cursor:pointer}
		</style>

		<script type="text/javascript">
			function changer() {
				document.getElementById('message').innerHTML = 'Mon nouveau message';
				return false;
			}
		</script>
	</head>
	<body>
		<div id="passerIntro">
			<span id="message" onclick="changer()">Message par defaut</span>
		</div>
	</body>
</html>


Mais si tu préfère garder le lien, il faut que la fonction retourne false pour que le lien soit neutralisé (qu'il n'y est pas de changement de page).
Eric2A a écrit :
Salut,

Le texte entre &lt;span&gt; et &lt;/span&gt; stylé ferait mieux l'affaire qu'un lien.

&lt;!DOCTYPE html&gt;
&lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot; lang=&quot;fr&quot;&gt;
	&lt;head&gt;
		&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=utf-8&quot; /&gt;
		&lt;title&gt;Test&lt;/title&gt;

		&lt;style type=&quot;text/css&quot;&gt;
			#message{cursor:pointer}
		&lt;/style&gt;

		&lt;script type=&quot;text/javascript&quot;&gt;
			function changer() {
				document.getElementById('message').innerHTML = 'Mon nouveau message';
				return false;
			}
		&lt;/script&gt;
	&lt;/head&gt;
	&lt;body&gt;
		&lt;div id=&quot;passerIntro&quot;&gt;
			&lt;span id=&quot;message&quot; onclick=&quot;changer()&quot;&gt;Message par defaut&lt;/span&gt;
		&lt;/div&gt;
	&lt;/body&gt;
&lt;/html&gt;


Mais si tu préfère garder le lien, il faut que la fonction retourne false pour que le lien soit neutralisé (qu'il n'y est pas de changement de page).