15. juni 2004 - 09:36Der er
30 kommentarer og 2 løsninger
Hurtig assistance efterlyses: Min tæller går i minus, hvorfor?
Hej eksperter
Det haster med lidt hjælp her – jeg skal aflevere denne opgave om 1½ time. HJÆLP!!!
Jeg har rodet med det her temmelig længe (og flere af jer har sikkert været involveret tidligere ;) ). Og jeg har stort set fået mine formularfelter med tæller mv. til at virke. Men jeg har et sidste pro-blem, som jeg simpelthen ikke kan gennemskue. Min tæller tillader tilsyneladende at gå i mi-nus – i hvert fald har brugeren mulighed for at indtaste udover de 160 karakterer, som er det max tilladte.
Her er funktionerne:
//Nægter et linjeskift function evaluateKey() { if (event.keyCode==13) event.returnValue=false; }
//Tilføjer "Vh " foran sætningen med navn/telefonnr. hvis feltet udfyldes function senderAddChar(senderText) { if (senderText.length == 1) { senderText = ("Vh " + senderText); document.smsForm.sendFrom.value = senderText; } countChars(); }
//Tæller (og nedtæller) antal karakterer m.v. function countChars() { var add = 0; //var charsLeft = 0; var msg = document.smsForm.smsMessage.value; var sender = document.smsForm.sendFrom.value;
//Mellemrum mellem smsMessage og sendFrom bliver ikke vist, men skal tælle for 1 tegn. if (sender.length == 0) add = 0; else add = 1;
//Beregner antal tegn tilbage charsLeft = maxChars-(msg.length+sender.length+add);
//Indsætter resultatet af beregning herover i q-elementet "taeller" document.getElementById('taeller').innerHTML = charsLeft;
//Hvis der er 0 (eller mindre) tegn tilbage (charsLeft) - return false. if (charsLeft == 0 || charsLeft < 0) return false; else return true; }
Af events der kalder ovenstående har jeg:
Mit textArea (name="smsMessage") med følgende events: onkeydown="evaluateKey();" onkeyup="return countChars(this.form);"
Og et felt (name="sendFrom") med disse events: onkeyup="senderAddChar(this.value);" onkeydown="senderAddChar(this.value);"
q-feltet er blot <q id="taeller" class="taeller">160</q>
Tælleren går i minus uanset om jeg indtaster i textArea (smsMessage) eller i tekstfeltet (send-From).
Hvorfor bliver indtastningen ikke stoppet af ”if (charsLeft == 0 || charsLeft < 0) return fal-se;”? Er der nogen der kan knække den nød?
>>yellow Nu har jeg forsøgt den mulighed, som du nævner, men det giver så et andet problem. Hvis jeg copy-paster tekst ind i textArea, går tælleren i minus uanset hvad - det kan jeg leve med. Men desværre bliver feltet fuldstændig låst, og brugeren har ingen mulighed for at slette eller redigere i feltet. Hvad kan jeg så gøre for at ændre på dette? marianne
...og feltet låser i øvrigt uanset hvad. Også selvom jeg kun skriver et tegn ad gangen (og ikke nødvendigvis copy-paster). Når tælleren når nul, er feltet låst for enhver yderligere indtastning.
...okay, det kommer her. Der er noget stylesheet på, men det behøver du nok ikke. Der er desuden lidt validering og andet, men den del skulle virke efter hensigten:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Send en SMS</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <LINK href="side2notes.css" rel="stylesheet" type="text/css">
<script type="text/javascript"> var maxChars = 160;
//VALIDERER FELTERNE I FORMULAREN INDEN AFSENDELSE: function validSms() { //Tjekker om der er indtastet mindst 8 tegn i mobiltelefonnummeret if(document.smsForm.sendTo.value.length < 8) return false; //Tjekker at feltet ikke er tomt if(document.smsForm.sendTo.value == "") return false;
//Tjekker at hvert eneste indtastet tegn er et tal (0-9) for(i=0;i<document.smsForm.sendTo.value.length;i++) { if(document.smsForm.sendTo.value.charAt(i)<"0") return false; }
function msgFilled() { //Tjekker at meddelelsen har et indhold if(document.smsForm.smsMessage.value == "") return false; return true }
//Tjekker om valideringen herover er opfyldt function validForm() { if(!validSms(document.smsForm.sendTo.value)) { alert("Du skal indtaste et mobiltelefonnummer bestående af otte eller ti tal (ti tal for et udenlandsk mobilnummer)"); document.smsForm.sendTo.focus(); document.smsForm.sendTo.select(); return false; }
if(!msgFilled(document.smsForm.smsMessage.value)) { alert("Du har ikke udfyldt feltet med beskeden til abonnenterne"); document.smsForm.smsMessage.focus(); return false; }
document.smsForm.submit(); document.smsForm.sendTo.focus(); } //SLUT PÅ VALIDERING
//Nægter et linjeskift function evaluateKey() { if (event.keyCode==13) event.returnValue=false; }
//Tilføjer "Vh " foran sætningen med navn/telefonnr. hvis feltet udfyldes function senderAddChar(senderText) { if (senderText.length == 1) { senderText = ("Vh " + senderText); document.smsForm.sendFrom.value = senderText; } countChars(); }
//Tæller (og nedtæller) antal karakterer m.v. function countChars() { var add = 0; //var charsLeft = 0; var msg = document.smsForm.smsMessage.value; var sender = document.smsForm.sendFrom.value;
//Mellemrum mellem smsMessage og sendFrom bliver ikke vist, men skal tælle for 1 tegn. if (sender.length == 0) add = 0; else add = 1;
//Beregner antal tegn tilbage charsLeft = maxChars-(msg.length+sender.length+add);
//Indsætter resultatet af beregning herover i q-elementet "taeller" document.getElementById('taeller').innerHTML = charsLeft;
//Hvis der er 0 (eller mindre) tegn tilbage (charsLeft) - return false. if (charsLeft <= 0) return false; else return true; } </script>
<tr valign="top"> <td> Eventuelt dit navn eller telefonnummer: </td> <td class="smallcelle"> <input name="sendFrom" id="sendFrom" type="text" size="30" tabindex="3" class="venstreFelt" onkeyup="senderAddChar(this.value);" onkeydown="senderAddChar(this.value);"> Der er <q id="taeller" class="taeller">160</q> ud af 160 tegn tilbage. </td></tr>
>>fennec Jeg er aldeles grøn udi det javascriptske - så hvordan (og hvor) skal jeg indsætte det du foreslår herover? Og hvad er det tanken, at jeg skal skrive i { gør noget...}? marianne
...okay, en anden mulighed for placering. Har lige testet >>yellow's mulighed, og det udløser et andet problem. For når jeg har nået til nul, og går tilbage og sletter (backspace hedder den vist), så opdateres tælleren ikke...?
kan ikke forstå at den ikke opdater tælleren. Det er da countChars() funktionen som gør det, er det ikke??? Og den burde blive kørt på onkeyup uanset hvad.
...jamen efter jeg satte koderne for tjek af keyCode ned ved selve event'et, så virker det også fint. Det var da jeg i første omgang forsøgte mig med >>yellow's version, hvor jeg tilføjede det til funktionen i toppen af siden. Men det har yellow selv bemærket ikke fungerer.
Noget andet er så sendFrom feltet - skal det så have tilsvarende onkeydown-script hæftet på? Lige p.t. kan dette felt nemlig få tælleren til at gå i minus.
hmmmm, nu har jeg forsøgt at tilføje det her "onkeydown="if(window.event.keyCode !=8...." til sendFrom feltet - med "{senderAddChar(this.value);}" som funktionen der kaldes. Men sendFrom feltet kan stadig gå i nul, hvad der måske skyldes måden, hvorpå funktionen senderAddChar afvikles på, eller????
Feltet sendFrom skal jo tælle med i tælleren, og skal på samme måde som textArea stoppes når der er nul karakterer tilbage... Så hvordan gør jeg det nu?
Hæhæ. Jeg tror jeg har fået det til at virke nu. Jeg tog indholdet af funktionen "addChar" og gjorde til en del af "countChars" (og slettede addChar). Så nu ser "countChar" således ud:
function countChars() { var add = 0; var charsLeft = 0; var msg = document.smsForm.smsMessage.value; var sender = document.smsForm.sendFrom.value;
//Tilføjer "Vh " foran sætningen med navn/telefonnr. hvis feltet udfyldes if (sender.length == 1) { sender = ("Vh " + sender); document.smsForm.sendFrom.value = sender; }
//Mellemrum mellem smsMessage og sendFrom bliver ikke vist, men skal tælle for 1 tegn. if (sender.length == 0) add = 0; else add = 1;
//Beregner antal tegn tilbage charsLeft = maxChars-(msg.length+sender.length+add);
//Indsætter resultatet af beregning herover i q-elementet "taeller" document.getElementById('taeller').innerHTML = charsLeft;
//Hvis der er 0 (eller mindre) tegn tilbage (charsLeft) - return false. if (charsLeft <= 0) return false; else return true;
...og så har jeg ændret tekstfeltets (sendFrom) events, så det virker som det I har foreslået:
Så fik jeg afleveret - og det ser ud til at fungere fint nu. Hurra for det. Så kan jeg få >>fennec og >>yellow på banen med et formelt svar. Hvis det er i orden med jer, synes jeg I skal dele pointene, da I begge har leveret dele til det færdige script. Er det okay - at i deler fifty-fifty?
...jamen så tusind tak for den hurtige hjælp. Det har virkelig reddet mig her på falderebet... :)
NB! Kan I iøvrigt anbefale mig en rigtig god javascriptbog. Det skal være et opslagsværk med en masse god kodeeksempler. Nem at slå op i og med gode korte konkrete forklaringer (ok med engelsksproget). Der er masser af bøger af typen "javascript bible" - men jeg har svært ved at vurdere, om den ene er at foretrække frem for den anden...
...tak - et par gode steder, der straks er blevet føjet til min javascriptbogmærkemappe ;)
marianne
Synes godt om
Ny brugerNybegynder
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.