JavaScript - Clonar, Añadir A Y eliminar Elemento Cuando Clickeed Sobre El.

 
Vista:
sin imagen de perfil

Clonar, Añadir A Y eliminar Elemento Cuando Clickeed Sobre El.

Publicado por Luis (24 intervenciones) el 29/06/2017 15:30:14
Buenas Colegas, Soy Nuevo En javascript Y Jquery. Tngo Una Serie De botones, Todos Con Las Misma Clase Y Sin Id. La Idea Es Que Cuando Clickeed Sobre Un Boton Este Se Clone Y Se Agregue A Un Div Nuevo, Eso Ya Lo Logre Hacer Con Jquery, Lo Que Quiero Es Que Cuando Vuelva A Clickear Este Clone Se Elimine. Agradecería Por Sus ayudas. Aqui Dejo Alguna Parte Del Codigo.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<div class="agg-bet">
</div>
<table  class="Market-With-Body-List">
	<tbody>
 
		<tr>
			<td class="mb-option-button">
				<button type="submit" class="button">
	        <div class="name-team-option">Real Madrid</div>
	        <div class="name-value-option">1.80</div>
				</button>
			</td>
	        <td class="mb-option-button">
				<button type="submit" class="button">
	        <div class="name-team-option">Barcelona</div>
	        <div class="name-value-option">2.00</div>
				</button>
			</td>
		</tr>
		<tr>
	        <td class="mb-option-button">
				<button type="submit" class="button">
	        <div class="name-team-option">Atlético De Madrid</div>
	        <div class="name-value-option">34.00</div>
				</button>
			</td>
	         <td class="mb-option-button">
				<button type="submit" class="button">
	        <div class="name-team-option">Sevilla</div>
	        <div class="name-value-option">151.00</div>
				</button>
			</td>
		</tr>
		<tr>
	         <td class="mb-option-button">
				<button type="submit" class="button">
	        <div class="name-team-option">Villarreal</div>
	        <div class="name-value-option">251.00</div>
				</button>
			</td>
	         <td class="mb-option-button">
				<button type="submit" class="button">
	        <div class="name-team-option">Valencia</div>
	        <div class="name-value-option">251.00</div>
				</button>
			</td>
		</tr>
	</tbody>
</table>
 
<script>
	 var ClickButtons =  [].slice.call(document.querySelectorAll('.button'));
 
	  ClickButtons.forEach(function(element, i){
		  element.addEventListener('click', function () {
		  $(element).clone().appendTo(".agg-bet");
				return false;
 
		  });
 
	  });
</script>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de ScriptShow
Val: 2.019
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Clonar, Añadir A Y eliminar Elemento Cuando Clickeed Sobre El.

Publicado por ScriptShow (692 intervenciones) el 30/06/2017 11:16:23
Saludos Luis,

veamos un ejemplo básico en JavaScript nativo:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<!DOCTYPE html>
<html>
<body>
<p>Click en el botón para crear un Párrafo con texto...</p>
<button onclick="test()">Crear ...</button>
<script>
function test() {
var elem = document.createElement('p');
elem.innerHTML = 'Éste es un párrafo con una frase ...';
document.body.appendChild(elem);
}
</script>
</body>
</html>

A partir de aquí, es posible crear, adaptar, ampliar... Sin grandes complicaciones.

Espero se útil.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
sin imagen de perfil

Clonar, Añadir A Y eliminar Elemento Cuando Clickeed Sobre El.

Publicado por Luis (24 intervenciones) el 02/07/2017 04:42:05
La Idea Es Que Cuando Yo Vuelva A Clickear Sobre El Boton Este Que Se Acabo De Crear Se Elimine. Gracias Por La Colaboración.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar