Avatar billede miss-g Seniormester
02. april 2018 - 04:40 Der er 1 kommentar og
1 løsning

Script indsætter ord i et textfield, men hvordan får jeg linjeskift med?

Et lille script indsætter ord i textfield. (Klik på et ord i tabel 1, og det ryger i textfield i tabel 2).

Hvordan får jeg et linjeskift efter hvert ord, som man indsætter, så de indsatte ord ikke står som vinden blæser/i en lang linje?

http://www.syord.dk/dansk_til_tysk_test.php

Koden er genbrug fra et andet spørgsmål, jeg oprettede.
--------------------------
<script>
// Indsæt specielle tegn
function insertAtCursor(myField, myValue) {
    //IE support
    if (document.selection) {
        myField.focus();
        sel = document.selection.createRange();
        sel.text = myValue;
    }
    //MOZILLA and others
    else if (myField.selectionStart || myField.selectionStart == '0') {
        var startPos = myField.selectionStart;
        var endPos = myField.selectionEnd;
        myField.value = myField.value.substring(0, startPos)
            + myValue
            + myField.value.substring(endPos, myField.value.length);
    } else {
        myField.value += myValue;
    }
}
var AtCursorList = document.querySelectorAll('.AtCursor');
var lng = AtCursorList.length;
for (var i = 0; i < lng; i++) {
    AtCursorList[i].addEventListener('click', function(event) {           
        insertAtCursor(tyske_ord, this.textContent);       
    });
}
</script>
Avatar billede olsensweb.dk Ekspert
02. april 2018 - 07:00 #1
en løs tanke, istedet for at kun sende over over ved click, så sende linjeskift + ord over

eks bue =
bliver til
\r\nbue =

du ved jo ikke hvor meget brugen skriver, om det spreder sig over flere linjer i dit text felt

du skal så have noget logik med serverside der fjerner tomme linjer, brugeren kan jo selv trykke enter, og derved lave linje skift.
Avatar billede olsensweb.dk Ekspert
02. april 2018 - 07:34 #2
en hurtig lille ændring af nuværende code, se fremhævet

var AtCursorList = document.querySelectorAll('.AtCursor');
var lng = AtCursorList.length;
for (var i = 0; i < lng; i++) {
    AtCursorList[i].addEventListener('click', function(event) {           
        insertAtCursor(tyske_ord, "\r\n"+this.textContent);       
    });
}


der er et lille issue omkring linje 0 du lige skal lege/leve med
men ovenstående er nemmeste løsning
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester