Mise en forme html dans un texte entre balises javascript

Version imprimable

29/08/2013, 01h55
noviceman

Mise en forme html dans un texte entre balises javascript
Bonjour,
j'emploie très peu javascript, donc je suis pô bon du tout dans ce domaine, mais j'ai le besoin d'employer le code "machine à écrire" pour un texte en début de page.
J'ai cherché sur google comment insérer du html dans un texte écrit à l'interrieur du script js, mais pas trouvé... Je vous demande une petite aide pour avaner et comprendre...
Code:

1 2 var letexte = 'Bienvenue, bla-bla <a href="#mon_lien">Nom du lien</a>'.
me transcrit le html en toute lettre avec les < et les ", mais ne fait pas le lien...
Comment insérer un lien à la fin de la phrase svp ?
<a href="#mon_lien">Nom du lien</a>
Car le texte est à l'interrieur de script js et aussi je voudrais mettre un <strong>mot</strong> sur un mot...??
Par avance merci...
29/08/2013, 09h18
SpaceFrog

Citation:

mais j'ai le besoin d'employer le code "machine à écrire"

Il serait peut être intéressant de nous montrer ton code de machine à ecrire ...

il est évident que si ce code insère le string lettre àprès lettre ça va poser un souci pour les balises html ...
Il faudra alors parser les string pour inserer la balise html en premier et y inserer le contenu texte ensuite.

Bonjour,
voici un code trouvé ici :

Code:

<div id="typewriterBox"></div>

Avec jQuery :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
    var text = 'Hello World, Boy ! <br /><a href="#mon_lien">Life is Big</a> !'
    var currentChar = 1;
    var htmltag = false;
    var cache = '';
    function typewriter()
    {
        var str = text.substr(0, currentChar);
        var last = str.substr(str.length -1, str.length);
        if(last != '<' && last != '>' & last != '/') {
            $("#typewriterBox").html(str);
        }
        currentChar++;
        if(currentChar <= text.length)
        {
            if(last == '<') {
                htmltag = true;
            } else if(last == '>') {
                htmltag = false;
            }
            if(htmltag) {
                setTimeout(typewriter, 1);
            } else {
                setTimeout(typewriter, 75);
            }
        }
    }
 
    $(document).ready(function() {
        $("#typewriterBox").html('');
        setTimeout(typewriter, 2000); // début d'affichage après 2s
    });
 
</script>

Sans :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<script type="text/javascript">
    var text = 'Hello World, Boy ! <br /><a href="#mon_lien">Life is Big</a> !'
    var currentChar = 1;
    var htmltag = false;
    var cache = '';
    function typewriter()
    {
        var str = text.substr(0, currentChar);
        var last = str.substr(str.length -1, str.length);
        if(last != '<' && last != '>' & last != '/') {
            document.getElementById('typewriterBox').innerHTML = str;
        }
        currentChar++;
        if(currentChar <= text.length)
        {
            if(last == '<') {
                htmltag = true;
            } else if(last == '>') {
                htmltag = false;
            }
            if(htmltag) {
                setTimeout(typewriter, 1);
            } else {
                setTimeout(typewriter, 75);
            }
        }
    }
 
    function loadtypewriter(){
		document.getElementById('typewriterBox').innerHTML = '';
        setTimeout(typewriter, 2000); // début d'affichage après 2s
    }
	window.onload = loadtypewriter;
</script>

29/08/2013, 14h25
SpaceFrog

la souci sera le même ... quand il va arriver sur le string <a ...
29/08/2013, 14h28
Invité

Ca fonctionne : http://codepen.io/jreaux62/pen/vHjFu