Script startet nicht neu, und unterbricht

one6666

Mitglied Titanium
Dokumenten Überwachung startet einmal danach nicht mehr

Hallo,

neue Frage steht unten


irgentwo ist hier ein Fehler drin:

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Steuerung</title>
<script type="text/javascript">
  var b_top_button, b_down_button, b_left_button, b_right_button, b_top_pos, b_down_pos, b_left_pos, b_right_pos;
  
  function b_top(index){
    if(typeof index == "undefined"){
	index = 1;
	}
	if(b_top_button == "focus"){
	  if(index < 800){
	    index++;
		up = b_top_pos + index; 
	    document.getElementById("car").style.top = up + "px";
	    window.setTimeout("b_top(" + index + ")", 50);
	  }
	}
  }
  
  function b_down(index){
    if(typeof index == "undefined"){
	index = 0;
	}
    if(b_down_button == "focus"){
	  if(index < 800){
	    index++;
		up = b_down_pos + index;
	    document.getElementById("car").style.bottom = up + "px";
	    window.setTimeout("b_down(" + index + ")", 50);
	  }
	}
  }
  
  function b_left(index){
     if(typeof index == "undefined"){
	index = 0;
	}
	if(b_left_button == "focus"){
	  if(index < 800){
	    index++;
		up = b_left_pos + index;
	    document.getElementById("car").style.left = up + "px";
	    window.setTimeout("b_left(" + index + ")", 50);
	  } 
	}
  }
  
  function b_right(index){
    if(typeof index == "undefined"){
	index = 0;
	}
	if(b_right_button == "focus"){
	  if(index < 800){
	    index++;
		up = b_right_pos + index;
	    document.getElementById("car").style.right = up + "px";
	    window.setTimeout("b_right(" + index + ")", 50);
	  }
	}
  }

  function key_check_on(key_code){
    switch(key_code.which){
      case 38:
	    b_top_pos = document.getElementById("car").style.top;
	    b_top_button="focus"; 
		b_top();
      break;
	  case 40:
	    b_down_pos = document.getElementById("car").style.bottom;
	    b_down_button="focus"; 
		b_down();
	  break;
	  case 37:
	    b_left_pos = document.getElementById("car").style.left;
	    b_left_button="focus"; 
		b_left();
	  break;
	  case 39:
	    b_right_pos = document.getElementById("car").style.right;
	    b_right_button="focus"; 
		b_right();
	  break;
    }
  }

  function key_check_up(key_code){
    switch(key_code.which){
      case 38:
	    b_top_button=""; 
      break;
	  case 40:
	    b_down_button=""; 
	  break;
	  case 37:
	    b_left_button=""; 
	  break;
	  case 39:
	    b_right_button=""; 
	  break;
    }
  }

  document.onkeydown = key_check_on;
  document.onkeyup = key_check_up;

</script>
</head>

<body>
  <div style="background:url(spiel_flaeche.png); width:800px; height:600px; margin:100px auto;">
    <img id="car" style="width:55px; height:20px; position:relative" src="auto.png" />
  </div>
</body>
</html>

Live Demo: http://media-volex.de/test51/beta.html

Mit gedrückter Taste soll das Auto eigentlich fahren, aber es bleibt so nach ~ 5px stehen :eek:
und wenn man dann noch mal eine Taste drückt fährt der nicht weiter :(

Weiß jemand warum ?

Nachtrag:
Dürckt mal Pfeil nach oben und dann gleichzeitig noch Pfeil nach links dann fährt das Auto bis nach unten, voll komisch :(

Und warum kann man keine documenten Überwachung mit onkeypress machen (wäre viel besser denn jetzt muss ich das gedrückte simulieren :( ) ?
 
Zuletzt bearbeitet:
Dokumenten Überwachung startet einmal danach nicht mehr

Hallo,

komme gut voran nur ist immer noch ein Problem da,
ich drücke zb. den Pfeil nach oben, das Script macht dann genau das was es soll, aber möchte ich dann noch einmal den Pfeil nach oben drücken passiert nix mehr :(

Habe links und rechts rausgenommen damit man es leichter durchschauen kann :)

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Steuerung</title>
<style type="text/css">
.box{
	background:#CF0;
	width:50px;
	height:50px;
	position:relative;
}
</style>
<script type="text/javascript">

var button_top, button_bottom;

function key_top(count){
  if(button_top == "on"){
    if(typeof count == "undefined"){
      count = document.getElementById("b_box").style.top;
    }
    if(count < 1000){
      count++;
	  document.getElementById("b_box").style.top = count + "px";
	  window.setTimeout("key_top(" + count + ")",100);
    }
  }
}

function key_bottom(count){
  if(button_bottom == "on"){
    if(typeof count == "undefined"){
      count = document.getElementById("b_box").style.bottom;
    }
    if(count < 1000){
      count++;
	  document.getElementById("b_box").style.bottom = count + "px";
	  window.setTimeout("key_bottom(" + count + ")",100);
    }
  }
}

function key_read_on(key_code){
  switch(key_code.which){
  case 38:
    button_top = "on";
    key_top();
  break;
  case 40:
    button_bottom = "on";
    key_bottom();
  break;
  }
}

function key_read_off(key_code){
  switch(key_code.which){
  case 38:
    button_top = "off";
  break;
  case 40:
    button_bottom = "off";
  break;
  }
}

document.onkeydown = key_read_on;
document.onkeyup = key_read_off;

</script>
</head>

<body>
<div id="b_box" class="box"></div>
</body>
</html>

Kommt mir so vor als wenn nach einen Ergebnis die Dokumenten Überwachung aufhört :eek:
 
Und warum kann man keine documenten Überwachung mit onkeypress machen

Wieso sollte das nicht gehen?

Ich hab mal schnell was zusammen gescribbelt, vielleicht hilfts dir ja :D
Javascript:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Steuerung</title>
<script type="text/javascript">
  
  function keypresshandler(e){
	var evtobj = window.event ? event : e;
	var keycode=evtobj.charCode ? evtobj.charCode : evtobj.keyCode;
	direction(keycode);
  }
  
  function direction(key){
	switch (key){
		case 37:
			drive('left');
		break;
		case 38:
			drive('up');
		break;
		case 39:
			drive('right');
		break;
		case 40:
			drive('down');
		break;
		default:
		break;
	}
  }
  
  function drive(direction){
	var start_X = getStartingPos('x');
	var start_Y = getStartingPos('y');
	var car = document.getElementById("car");
	switch (direction) {
		case "left":
			if (endOfField('x-',start_X)){
				car.style.left = start_X - 1 + "px";
			}
		break;
		case "up":
			if (endOfField('y-',start_Y)){
				car.style.top = start_Y - 1 + "px";
			}
		break;
		case "right":
			if (endOfField('x',start_X)){
				car.style.left = start_X + 1 + "px";
			}
		break;
		case "down":
			if (endOfField('y',start_Y)){
				car.style.top = start_Y + 1 + "px";
			}
		break;
	}
  }
  
  function getStartingPos(axis){
	switch (axis){
		case "x":
			var x = document.getElementById("car").style.left;
			return parseInt(x.replace(/px/,""));
		break;
		case "y":
			var y = document.getElementById("car").style.top;
			return parseInt(y.replace(/px/,""));
		break;
	}
  }
  
  function endOfField(axis,pos){
	var field_width = parseInt(document.getElementById("gField").style.width.replace(/px/,""));
	var field_height = parseInt(document.getElementById("gField").style.height.replace(/px/,""));
	var car_width = parseInt(document.getElementById("car").style.width.replace(/px/,""));
	var car_height = parseInt(document.getElementById("car").style.height.replace(/px/,""));
	switch (axis){
		case "x":
			if ( car_width + pos >= field_width ){
				return false;
			}
		break;
		case "x-":
			if ( pos <= 0 ){
				return false;
			}
		break;
		case "y":
			if ( car_height + pos >= field_height ){
				return false;
			}
		break;
		case "y-":
			if ( pos <= 0 ){
				return false;
			}
		break;
	}
	return true;
  }
      
  document.onkeypress = keypresshandler;
  
</script>
</head>

<body>
  <div style="background:url(spiel_flaeche.png); width:800px; height:600px; margin:100px auto;" id="gField">
    <img id="car" style="width:55px; height:20px; position:relative;top:0px;left:0px;" src="auto.png" />
  </div>
</body>
</html>

Nur mit FF getestet.
 
Vorab super nett das du dir die Mühe gemacht hast mir etwas zu Coden,
aber ich muss immer alles selber machen, damit ich zufrieden bin :)

Sonst könnte ich mri auch JQuery rein laden und dann ....

Aber für mein lern Ziel muss ich einfach selber mit allen Fehlern erfahrungen gemacht haben ;)

Mich interessiert jetzt nur die zweite Frage also die aus dem Post der hier einfach rein geschoben wurde,
dort bin ich schon fleißig auf Fehler suche, und weiß jetzt das die Documenten Überwachung nicht schuld ist siehe hier den Fehlersuch Code:

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Steuerung</title>
<style type="text/css">
.box{
	background:#CF0;
	width:50px;
	height:50px;
	position:relative;
}
</style>
<script type="text/javascript">

var button_top, button_bottom;

function key_top(count){
  if(button_top == "on"){
	document.getElementById("ausgabe").innerHTML = button_top;
    if(typeof count == "undefined"){
      count = document.getElementById("b_box").style.top;
    }
    if(count < 200){
      count++;
	  document.getElementById("b_box").style.top = count + "px";
	  window.setTimeout("key_top(" + count + ")",100);
    }
  }
}

function key_bottom(count){
  if(button_bottom == "on"){
	document.getElementById("ausgabe").innerHTML = button_bottom;
    if(typeof count == "undefined"){
      count = document.getElementById("b_box").style.bottom;
    }
    if(count < 1000){
      count++;
	  document.getElementById("b_box").style.bottom = count + "px";
	  window.setTimeout("key_bottom(" + count + ")",100);
    }
  }
}

function key_read_on(key_code){
  switch(key_code.which){
  case 38:
    button_top = "on";
    key_top();
  break;
  case 40:
    button_bottom = "on";
    key_bottom();
  break;
  }
}

function key_read_off(key_code){
  switch(key_code.which){
  case 38:
    button_top = "off";
	document.getElementById("ausgabe").innerHTML = button_top;
  break;
  case 40:
    button_bottom = "off";
	document.getElementById("ausgabe").innerHTML = button_bottom;
  break;
  }
}

document.onkeydown = key_read_on;
document.onkeyup = key_read_off;

</script>
</head>

<body>
<div id="b_box" class="box"></div><div style="z-index:1; position:relative;" id="ausgabe"></div>
</body>
</html>

Zeigt das die functionen auch ein weiteres mal reagieren aber die schleife läuft einfach nicht ein zweites mal an,
und ich kann es mir einfach nicht erklären :(

Über weitere hilfe würde ich mich sehr freuen :)
 
Mich interessiert jetzt nur die zweite Frage also die aus dem Post der hier einfach rein geschoben wurde,
So "einfach" dann doch nicht :rolleyes:

und wenn man dann noch mal eine Taste drückt fährt der nicht weiter :(

[...]

Nachtrag:

[...]

Und warum kann man keine documenten Überwachung mit onkeypress machen (wäre viel besser denn jetzt muss ich das gedrückte simulieren :( ) ?

komme gut voran nur ist immer noch ein Problem da,
ich drücke zb. den Pfeil nach oben, das Script macht dann genau das was es soll, aber möchte ich dann noch einmal den Pfeil nach oben drücken passiert nix mehr :(

[...]

Kommt mir so vor als wenn nach einen Ergebnis die Dokumenten Überwachung aufhört :eek:

mfg Maik
 
aber ich muss immer alles selber machen, damit ich zufrieden bin

Sonst könnte ich mri auch JQuery rein laden und dann ....
Das hab ich mir schon gedacht, deswegen war es auch nur als Denkanstoss gedacht.


Zu deinem Problem:
Es ist eigentlich relativ einfach.
Beim ersten Aufruf wird folgende Zeile ausgeführt.
Javascript:
if(typeof count == "undefined"){
      count = document.getElementById("b_box").style.top;
    }

count ist dabei immer vom Typ int. (z.B. 3)

Wenn du das jetzt ein zweites mal ausführst ist count aber vom Typ String (z.B. 3px)

Den Rest kannst du dir dann wahrscheinlich selber zusammen reimen.

Testen kannst du das ganz einfach indem du mal folgendes benutzt:
<div id="b_box" class="box" style="top:0px;">
Dann geht nämlich garnix mehr :D

Abhilfe findest du in meinem "Denkanstoß" ;)
z.B. Hier
Javascript:
var field_width = parseInt(document.getElementById("gField").style.width.replace(/px/,""));
 
Zuletzt bearbeitet:

Neue Beiträge

Zurück