Ir para conteúdo
  • 0
lucascuri1

Trocar o .src de uma <img> através de um id dentro de um vetor

Pergunta

Estou desenvolvendo um script e quero trocar a foto da cadeira conforme a pessoa digite o id da cadeira no input, no caso "banco1", ou "banco2", porém, quando eu fui fazer isso, tentei utilizar um banco[ i ].src = "banco2.jpg"; (ou banco.src[ i ], não sei qual o correto), mas tentei ambos e não funcionou. Alguém sabe como eu poderia mudar a imagem de acordo com o id que a pessoa digitou?

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8">
</head>
<body>
	
	<h1>Teatro Guarani - Show Papas da Língua</h1>

	<hr>

	<p>Poltrona:<input id="poltrona">
	<button type="button" onclick="reservarPoltrona()">Reservar</button>
	</p>

	<hr>

	<div id="mapa" style="font-family: 'Courier New'; font-size: 10px">
		<h3>Mapa do Teatro</h3>
	</div>

	<p>Legenda: </p>

	<h4>
		<img src="banco.jpg" style="width: 25px; height: 35px">Poltrona Disponível
		<img src="banco2.jpg" style="width: 25px; height: 35px">Poltrona Reservada
	</h4>
	
	<script>
	var aReserva = [];

	montarMapa();

			function montarMapa() {
				for (i = 1; i <= 300; i++) {

				var sp = document.createElement("span");
				var zeros = "";
				if (i<10) {
					zeros = "00";
				} else if (i<100) {
					zeros = "0";
				}

				var num = document.createTextNode("["+zeros+i+"]");
				if (i % 20 == 11) {
					sp.style.marginLeft = "100px";
				} else {
				sp.style.marginLeft = "5px";
				}
				sp.appendChild(num);
				document.getElementById("mapa").appendChild(sp);

				var banco = document.createElement("img");
				banco.src = "banco.jpg";
				document.getElementById("mapa").appendChild(banco);
				banco.style.width = "35px";
				banco.style.height = "40px";
				banco.id = "banco" + i;

				if (i % 20 == 0) {
					var br = document.createElement("br");
					document.getElementById("mapa").appendChild(br);
				}
	}
	}

			function reservarPoltrona() {

				var poltrona = document.getElementById("poltrona").value;
				var banco = document.createElement("img");
				aReserva.push(poltrona);

				if (poltrona == "" || isNaN(poltrona) || poltrona < 1 || poltrona > 300) {
				
					
						if (aReserva[i] == banco[i]) {
							banco.src = "banco2.jpg";	
							banco.style.width = "35px";
							banco.style.height = "40px";
						}
					
				}
					
	}
				
	
	</script>
	
</body>
</html>

 

banco.jpg

banco2.jpg

Compartilhar este post


Link para o post
Compartilhar em outros sites

0 respostas a esta questão

Recommended Posts

Até agora não há respostas para essa pergunta

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por rodrigoalgeri
      BOA NOITE
      OLHA ISSO onde esta escrito isso aqui "Health star ratings Kellogg reveals the cereal Rodrigo Algeri", tem uma pequena imagem em cima se voce perceber ela e uma imagem redonda so que nao aparece inteira voce sabe algum jeito pra aparecer ? tipo ela tem que ficar 75px altura e largura a altura fica, so que ela corta, EU GOSTARIA QUE FICASSE UM QUADRADO TIPO 75PX X
      75PX E ISSO E PRA FICAR EM TODAS ESSAS IMAGENS AI QUE TEM 

    • Por darkskull10
      Numa cidade as crianças costumam brincar com um jogo (de dois jogadores) onde:
      um jogador A define uma sequência de 10 letras usando: G, R e B (exemplo: G – G – G – R – B – R – B – B – B – R)
      um jogador B pode ler a sequência quantas vezes quiser
      o jogador B também pode dizer uma das letras e obter em quais posições a letra dada se encontra na sequência
      o jogador B também pode dar uma posição e saber qual letra ocupa a posição na sequência
      para finalizar, o jogador B deve dizer a sequência de letras, obtendo um ponto para cada acerto.
       
      Só consegui pensar nisso por enquanto.
       
      //identificar que letra ocupa esta posição na sequência:
      do{
      scanf(“%d”,&Posicao);
      Posicao=Posicao-1;}
      while ((Posicao<0)||(Posicao>9));
      printf(“%c”,Sequencia[Posicao]);
       
      //exibir sequencia
      for (Cont=0; Cont<=9; Cont++)
      printf(“%c”,Sequencia[Cont]);
       
      //exibir posições
      for (Cont=0; Cont<=9; Cont++)
      printf(“%d%c”,Cont+1,Sequencia[Cont]);
    • Por paulo.e.monteiro2015
      Boa noite,
       
      Possuo o seguinte array
      Array ( [0] => Array ( [0] => 564 [IdPergunta] => 564 [1] => 66 [IdQuiz] => 66 [2] => A EMS é líder no mercado farmacêutico há quantos anos? [DescricaoPergunta] => A EMS é líder no mercado farmacêutico há quantos anos? [3] => 1 [NumeroPergunta] => 1 ) [1] => Array ( [0] => 565 [IdPergunta] => 565 [1] => 66 [IdQuiz] => 66 [2] => A cada 100 medicamentos vendidos no Brasil 13 são de qual laboratório? [DescricaoPergunta] => A cada 100 medicamentos vendidos no Brasil 13 são de qual laboratório? [3] => 2 [NumeroPergunta] => 2 ) [2] => Array ( [0] => 566 [IdPergunta] => 566 [1] => 66 [IdQuiz] => 66 [2] => Qual medicamento controlado e lançamento dos Genéricos EMS é indicado para alívio de dores e possui formato de fácil deglutição? [DescricaoPergunta] => Qual medicamento controlado e lançamento dos Genéricos EMS é indicado para alívio de dores e possui formato de fácil deglutição? [3] => 3 [NumeroPergunta] => 3 ) [3] => Array ( [0] => 567 [IdPergunta] => 567 [1] => 66 [IdQuiz] => 66 [2] => Os Genéricos EMS possuem o maior portfólio do Brasil, com 195 moléculas, que atendem 96% das classes terapêuticas. Qual o número total de apresentações? [DescricaoPergunta] => Os Genéricos EMS possuem o maior portfólio do Brasil, com 195 moléculas, que atendem 96% das classes terapêuticas. Qual o número total de apresentações? [3] => 4 [NumeroPergunta] => 4 ) [4] => Array ( [0] => 568 [IdPergunta] => 568 [1] => 66 [IdQuiz] => 66 [2] => A EMS possui quantos anos de história? [DescricaoPergunta] => A EMS possui quantos anos de história? [3] => 5 [NumeroPergunta] => 5 ) [5] => Array ( [0] => 569 [IdPergunta] => 569 [1] => 66 [IdQuiz] => 66 [2] => Qual lançamento Genéricos EMS é o primeiro genérico do mercado indicado para o tratamento do Transtorno do Déficit de Atenção e Hiperatividade? [DescricaoPergunta] => Qual lançamento Genéricos EMS é o primeiro genérico do mercado indicado para o tratamento do Transtorno do Déficit de Atenção e Hiperatividade? [3] => 6 [NumeroPergunta] => 6 ) ) Preciso criar uma navegação item a item deste, para que possa dar a opção do usuário responder ao Quiz.
      Preciso muito desta ajuda pois tenho muita urgência em resolver isso. É só isso que falta para terminar o Quiz.
       
      Att.
    • Por markhosbh
      Prezados, boa tarde!
       
      Estou tendo dificuldades para transformar um retorno WebService em uma tabela HTML.
      A minha dificuldade está na seguinte condição, se fosse cabeçalho fixo bastava eu utilizar o foreach para percorrer o array e estava ok.
      Porém, a quantidade de campos do array de retorno não é fixo, aí que se encontra minha dificuldade, como fazer para ler e imprimir o cabeçalho e o conteúdo da tabela, sendo que essas informações podem variar.
       
      Exemplo:
       
      Requisição: 
      SELECT A1_COD, A1_NOME, TIPO FROM USUARIO  
      Retorno:
      [ {"A1_COD":"0093","A1_NOME":"JOAO","TIPO":"TITULAR"}, {"A1_COD":"0016","A1_NOME":"ABELARDO","TIPO":"TITULAR"}, {"A1_COD":"8586","A1_NOME":"ADRIANA","TIPO":"TITULAR"} ]  
      Array:
      Array ( [0] => Array ( [A1_COD] => 0093 [A1_NOME] => JOAO [TIPO] => TITULAR ) [1] => Array ( [A1_COD] => 0016 [A1_NOME] => ABELARDO [TIPO] => TITULAR ) [2] => Array ( [A1_COD] => 8586 [A1_NOME] => ADRIANA [TIPO] => TITULAR ) ) Quero que seja impresso em uma tabela html
       
      A1_COD A1_NOME TIPO 0093 JOAO TITULAR 0016 ABELARDO TITULAR 8586 ADRIANA TITULAR  
      Mas como informado o cabeçalho poderia variar, sendo a requisição por exemplo ser:
       
      SELECT * FROM USUARIO  
      Desde então agradeço.
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.