[Javascript] Onkeyup voor gereserveerde toetsen - Softwareontwikkeling

donderdag 26 januari 2006 13:55

Acties:

Topicstarter

Hai

Ik wil de grootte van een textarea aan laten passen op de inhoud van de tekst. Dit lukt al prima, alleen er is 1 probleem.
Als ik onkeydown gebruik pakt hij de enter en de delete knop enzo wel, maar dan voert hij mijn functie uit voordat de functie van de toets zelf (dus verwijderen of een enter toevoegen) uitvoert. Hierdoor werkt de entertoets en de deletetoets niet goed; hij heeft bijvoorbeeld nog alle tekst erinstaan terwijl de bedoeling is dat hij de functie uitvoert nadat alles verwijderd is.

Wat ik nodig heb is dus de onkeyup functie, maar die pakt de enter en delete toets enzo dus niet.
Hoe kan dit wel?

code:

<html>
  <script>
    var prev_height = -1;
    function change_size(e, obj)
    {
       document.title = obj.innerText;
      if (obj.scrollHeight < obj.style.height.replace("px", "")) { obj.style.height = 10; }
       tmp = obj.scrollHeight;
      if (e.keyCode == 10 || e.keyCode == 13)
        obj.style.height = obj.scrollHeight + 20;
      else
        obj.style.height = obj.scrollHeight + 4;
      prev_height = obj.scrollHeight;
    }
  </script>
  <body>
    <textarea id="tekst" style="width:500px; height:100px;" onkeydown="change_size(event, this);"></textarea>
  </body>
</html>

donderdag 26 januari 2006 13:57

Acties:

Janoz

Moderator Devschuur®

!litemod

Javascript hoort bij de buren van Webdesign & Graphics. Ik zal daarom dit topic even verplaatsen

Ken Thompson's famous line from V6 UNIX is equaly applicable to this post:
'You are not expected to understand this'

donderdag 26 januari 2006 14:40

Acties:

André

Analytics dude

Misschien onkeypress proberen

donderdag 26 januari 2006 14:44

Acties:

marcrenzo

Topicstarter

Met onkeypress reageert hij helemaal niet op backspace en delete, wel op normale abc toetsen en enter

donderdag 26 januari 2006 15:23

Acties:

André

Analytics dude

En als je het nu met een vertraging doet:

code:

<html>
  <script>
    var prev_height = -1;
    
    function change_size(e, obj)
    {
      setTimeout("bla('" + e.keyCode + "', '" + obj + "')", 10);
    }
    
    function bla(e, o)
    {
      obj = document.getElementById(o);
      
      document.title = obj.innerText;
 
      if (obj.scrollHeight < obj.style.height.replace("px", "")) { obj.style.height = 10; }
      tmp = obj.scrollHeight;
 
      if (e == 10 || e == 13)
      { obj.style.height = obj.scrollHeight + 20; }
      else
      { obj.style.height = obj.scrollHeight + 4; }
      
      prev_height = obj.scrollHeight;
    }    
    
  </script>
  <body>
    <textarea id="tekst" style="width:500px; height:100px;" onkeydown="change_size(event, this.id);"></textarea>
  </body>
</html>

donderdag 26 januari 2006 15:41

Acties:

Guillome

test

Dat is een goeie, had van mij kunnen komen!! (Ik hielp m op school net

) Even testen

[ Voor 18% gewijzigd door Guillome op 26-01-2006 15:42 ]

If then else matters! - I5 12600KF, Asus Tuf GT501, Gigabyte Gaming OC 16G 5080 RTX, Asus Tuf Gaming H670 Pro, 48GB, Corsair RM850X PSU, SN850 1TB, Arctic Liquid Freezer 280, ASUS RT-AX1800U router

donderdag 26 januari 2006 16:06

Acties:

Guillome

test

code:

<html>
  <head>
    <script>
      var prev_height = -1;
      
      function change_size(e, obj)
      {
        setTimeout("_change_size('" + e.keyCode + "', '" + obj + "')", 0);
      }
      
      function _change_size(e, obj)
      {
        obj = document.getElementById(obj);
        
        document.title = obj.innerText;
        
        if (obj.scrollHeight < obj.style.height.replace("px", "")) { obj.style.height = 10; }
        tmp = obj.scrollHeight;
        obj.style.height = obj.scrollHeight + 4;      
        prev_height = obj.scrollHeight;
      }
    </script>
  </head>
  <body>
    <textarea id="stekst" style="overflow-y:hidden; width:500px; height:100px;" onkeydown="change_size(event, this.id);" onpaste="change_size(event, this.id);"></textarea>
  </body>
</html>

If then else matters! - I5 12600KF, Asus Tuf GT501, Gigabyte Gaming OC 16G 5080 RTX, Asus Tuf Gaming H670 Pro, 48GB, Corsair RM850X PSU, SN850 1TB, Arctic Liquid Freezer 280, ASUS RT-AX1800U router

donderdag 26 januari 2006 16:14

Acties:

marcrenzo

Topicstarter

Ik dank u vriendelijk, dit werkt

donderdag 26 januari 2006 16:17

Acties:

crisp

Devver

Pixelated

innerText? afmetingen in CSS zonder eenheid? Hoeft zeker alleen in IE te werken?

Deze is ook leuk:

JavaScript:

1	obj.style.height.replace("px", "")

daar is juist parseInt() voor bedoelt o.a.

[ Voor 43% gewijzigd door crisp op 26-01-2006 16:19 ]

Intentionally left blank

donderdag 26 januari 2006 16:22

Acties:

Guillome

test

waar zie jij innertekst staan? waar zie jij afmetingen zonder eenheid? HEt werkt in FF en IE
Die laatste is een goeie, dank je

If then else matters! - I5 12600KF, Asus Tuf GT501, Gigabyte Gaming OC 16G 5080 RTX, Asus Tuf Gaming H670 Pro, 48GB, Corsair RM850X PSU, SN850 1TB, Arctic Liquid Freezer 280, ASUS RT-AX1800U router

donderdag 26 januari 2006 16:37

Acties:

crisp

Devver

Pixelated

XLerator schreef op donderdag 26 januari 2006 @ 16:22:
waar zie jij innertekst staan? waar zie jij afmetingen zonder eenheid?

JavaScript:

1	document.title = obj.innerText;

JavaScript:

1	obj.style.height = obj.scrollHeight + 4;

HEt werkt in FF en IE

quirksmode zeker?

Intentionally left blank

donderdag 26 januari 2006 17:06

Acties:

Guillome

test

watte?

En je moet wel mn laatste post pakken he, dat is de final

En die 2e los ik (lees: renzo) ook wel op

Dank je

If then else matters! - I5 12600KF, Asus Tuf GT501, Gigabyte Gaming OC 16G 5080 RTX, Asus Tuf Gaming H670 Pro, 48GB, Corsair RM850X PSU, SN850 1TB, Arctic Liquid Freezer 280, ASUS RT-AX1800U router

Pagina: 1

Reageer