• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[FRAGE] Wie kann ich aus zwei Buttons mit "onmouse" Event EINEN Button mit "onclick" basteln?

catman

New member
Wie kann ich aus zwei Buttons mit "onmouse" Event EINEN Button mit "onclick" basteln?

Hi zusammen und schöne Ostern! :)

Um nur jeweils den ersten Eintrag aus dreireihigen Tabellen anzuzeigen, benutze ich folgendes Skript:

HTML:
<head>
<script>
<!--

function ShowRow(id,min,ud){
 var o=ShowRow['zxc'+id],obj=document.getElementById(id),table=obj.getElementsByTagName('TABLE')[0],ud=typeof(ud)=='number'&&ud<0?-2:2,rows;
 if (obj&&table&&!o){
  rows=table.rows,min=typeof(min)=='number'&&min>0?min:0;
  o=ShowRow['zxc'+id]={
   rows:rows,
   lgth:rows.length-1,
   min:min,
   cnt:min
  }
  row=o.rows[o.cnt];
  obj.style.height=row.offsetTop+row.offsetHeight+'px';
 }
 if (o){
  o.cnt=Math.max(Math.min(o.cnt+ud,o.lgth),o.min);
  obj.style.height=o.rows[o.cnt].offsetTop+o.rows[o.cnt].offsetHeight+'px';
 }



}

-->
</script> 
</head>
<body onload="ShowRow('tst1',0,-2)">

<input type="button" name="" value="Weitere anzeigen" onmouseup="ShowRow('tst1',0,2);" />
<input type="button" name="" value="Nur erste Zelle anzeigen" onmouseup="ShowRow('tst1',0,-2);" />

<div id="tst1" style="width:100%;overflow:hidden;height:80px;border:solid red 1px;">
<table>
<tr>
<td>Zelle 1</td>
</tr>
<tr>
<td>Zelle 2</td>
</tr>
<tr>
<td>Zelle 3</td>
</tr>
</table>
</div>

</body>

Frage: Wie kann ich aus den beiden Buttons, mit denen ich Reihen ein- und ausblende, EINEN Toggle-Button mit onclick-Funktion basteln, der beim ersten Klick --> ShowRow('tst1',0,2) <-- und beim zweiten Klick wieder --> ShowRow('tst1',0,-2) <-- setzt?

Kann mir da jemand helfen? Vielen herzlichen Dank!
 
AW: Wie kann ich aus zwei Buttons mit "onmouse" Event EINEN Button mit "onclick" bast

Man könnte per Javascript in deiner ShowRow Funktion den "onirgendwas" code des Buttons jeweils neu setzten.

Man könnte auch mittels Closure eine Schalterfunktion bauen, und weil ich Closures klasse finde seit ich glaube sie verstanden zu haben hab ich das mal gemacht. Schau mal, ob Dir Folgendes gefällt:

HTML:
<head>
<script>
<!--

function ShowRow(id,min,ud){
 var o=ShowRow['zxc'+id],obj=document.getElementById(id),table=obj.getElementsByTagName('TABLE')[0],ud=typeof(ud)=='number'&&ud<0?-2:2,rows;
 if (obj&&table&&!o){
  rows=table.rows,min=typeof(min)=='number'&&min>0?min:0;
  o=ShowRow['zxc'+id]={
   rows:rows,
   lgth:rows.length-1,
   min:min,
   cnt:min
  }
  row=o.rows[o.cnt];
  obj.style.height=row.offsetTop+row.offsetHeight+'px';
 }
 if (o){
  o.cnt=Math.max(Math.min(o.cnt+ud,o.lgth),o.min);
  obj.style.height=o.rows[o.cnt].offsetTop+o.rows[o.cnt].offsetHeight+'px';
 }
}

function fnDummy(){
	var onoff = 0;
	function fnSwitchOnOff(){
		var obj=document.getElementById("idOnOffSwitch");
		if (onoff===0) {
			onoff=1;
			obj.value="Nur erste Zelle anzeigen";
			ShowRow('tst1',0,2);
			}
		else if (onoff===1) {
			onoff=0;
			obj.value="Weitere anzeigen";
			ShowRow('tst1',0,-2);
			}
		}
	return fnSwitchOnOff;
	}

var fnShowRowSwitch = fnDummy();
	
-->
</script> 
</head>
<body onload="ShowRow('tst1',0,-2)">

<input id="idOnOffSwitch" type="button" name="" value="Weitere anzeigen" onclick="fnShowRowSwitch()" />

<!--<input type="button" name="" value="Weitere anzeigen" onmouseup="ShowRow('tst1',0,2);" />
<input type="button" name="" value="Nur erste Zelle anzeigen" onmouseup="ShowRow('tst1',0,-2);" />-->

<div id="tst1" style="width:100%;overflow:hidden;height:80px;border:solid red 1px;">
<table>
<tr>
<td>Zelle 1</td>
</tr>
<tr>
<td>Zelle 2</td>
</tr>
<tr>
<td>Zelle 3</td>
</tr>
</table>
</div>

</body>
 
Zuletzt bearbeitet:
Zurück
Oben