insert tr dans un tableau

Bonjour,

je dois créer des lignes de tr sous le tr ou je suis

j'ai bien trouvé en jquery

Code:

$('#matable tbody>tr:last').clone(true).insertAfter('#matable tbody>tr:last');

mais cela me met le nouveau tr à la fin

Ce que je veux c'est si j'ai 5 lignes et que je clique sur la 3eme ligne cela rajoute le nouvelle en 4ème
et je voudrais également supprimé les valeur de mes inputs qui son cloner

merci

Bonsoir

C'est logique ! Avec "tbody > tr:last" on travaille toujours sur la dernière ligne du tbody.
Code:

1 2 3 $( "#maTable tbody > tr" ).on( "click", function(){ $( "<tr></tr>" ).insertAfter( this ); });

ok mais appliquer un mask

Merci cela fonction par contre, dans ma ligne de tr rajouter , j'ai un input text
sur lequel sur document ready j'applique un masque de saisie (téléphone)
comment je peut faire pour l'appliquer sur ma page
Code:

1 2 3 jQuery(function($){ $("#vendeur1_dom").mask("99.99.99.99.99"); })
par contre lors que j'ajoute une ligne je fais :
Code:

1 2 3 4 5 $.each($('#tabindivision tbody>tr input'), function() { if ($(this).attr('id')=='indiv_tel'){ $(this).mask("99.99.99.99.99"); } });
elt la cela ne marche pas

une idée

Bonjour

En HTML5 ? Exemple :

Code:

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
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<!DOCTYPE html>
<html lang="fr" dir="ltr">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="initial-scale=1.0">
	<meta name="author" content="Daniel Hagnoul">
	<title>Forum jQuery</title>
	<script src="http://cdnjs.cloudflare.com/ajax/libs/headjs/0.99/head.min.js"></script>
	<script>
		"use strict";
 
		head.js( 
			"http://d3js.org/d3.v3.min.js",
			//"http://code.jquery.com/jquery-2.0.3.min.js",
			//"http://code.jquery.com/jquery-2.1.0-beta1.js",
			"http://code.jquery.com/jquery-1.8.3.min.js",
			"http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/i18n/jquery-ui-i18n.min.js",
			"http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js",
			"http://danielhagnoul.developpez.com/lib/dvjh/d3Base.js", function(){
 
$( function(){
 
$( "#maTable tbody > tr" ).on( "click", function(){
    $( '<tr><td>Hello</td><td><input type="tel" pattern="^[0-9]{2}\.[0-9]{2}\.[0-9]{2}\.[0-9]{2}\.[0-9]{2}$" placeholder="numéro de téléphone" title="ex: 99.99.99.99.99" required autofocus></td></tr>' ).insertAfter( this );
});
 
$( "form" ).on( "submit", function(){
	return false;
});
 
 
});
 
$( window ).load( function(){
 
});
 
		});
	</script>
	<link href='http://fonts.googleapis.com/css?family=Sofia|Ubuntu:400|Kreon'>
	<link rel="stylesheet" href="http://danielhagnoul.developpez.com/styles/dvjhRemBase.css">
	<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/sunny/jquery-ui.min.css">
	<style>
		/* TEST -- Nota bene : ici 1 rem est égal à 10 px, voir dvjhRemBase.css */
 
 
	</style>
</head>
<body>
	<header>
		<hgroup>
			<h1>Forum jQuery</h1>
			<h2>
				<a href="">Lien</a>
			</h2>
		</hgroup>
	</header>
	<section class="conteneur">
 
<form>
	<table id="maTable">
		<tbody>
			<tr>
				<td>Un</td>
				<td>Deux</td>
			</tr>
		</tbody>
	</table>
	<input type="submit" value="Soumettre">
</form>
 
	</section>
	<footer itemscope itemtype="http://danielhagnoul.developpez.com/">
		<time datetime="2013-10-18T15:50:23.583+02:00" pubdate>2013-10-18T15:50:23.583+02:00</time>
		<span itemprop="name">Daniel Hagnoul</span>
		<a href="http://www.developpez.net/forums/u285162/danielhagnoul/" itemprop="url">@danielhagnoul</a>
		<a href="http://danielhagnoul.developpez.com/" itemprop="url">Mon cahier d’exercices</a>
		<a href="http://javascript.developpez.com/faq/jquery/" itemprop="url">FAQ</a>
		<a href="http://javascript.developpez.com/cours/?page=frameworks#jquery" itemprop="url">Tutoriels</a>
	</footer>
</body>
</html>