Comment préserver les sauts de ligne d'un div contenteditable pour un textarea ?
Bonjour,
j'ai un div contenteditable dont le texte saisi doit être recopié vers un textarea.
Pour cela, j'utilise textContent de Firefox (car innerText ne marche pas dans Firefox).
Le problème est que quand je tape sur la touche "Entrée" dans le div contenteditable pour créer des sauts de lignes,
ces sauts de ligne n'apparaîssent pas dans le textarea.
Voici le code source, très simple :
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
| <style type="text/css">
.textarea{
overflow: hidden;
resize: none;
width: 100%;
white-space: pre-line;
border: solid #cccccc 1px ;
height: 34px;
}
</style>
<form style="width:500px;" method="post">
Div contenteditable :
<div class="textarea" contenteditable="true" onkeyup='copy_text_in_textarea(this);'></div>
<br>Textarea :
<textarea rows="2" class="textarea" id="textarea" name="textarea"></textarea>
</form>
<script type="text/javascript">
/*Fonction pour copier le text du div vers le textarea :*/
function copy_text_in_textarea(this_contenteditable)
{
document.getElementById("textarea").value = this_contenteditable.textContent;
}
</script> |
Vous pouvez l'essayer avec Firefox ici : https://jsfiddle.net/Ls6j041g/
Donc ma question est comment préserver les sauts de lignes dans le textarea ?
Merci d'avance, cordialement.
