Bug Tracker

Ticket #921: test.html

File test.html, 1.5 KB (added by brice, 15 years ago)

IE Clone Test

Line 
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
2        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
4<head>
5<title>jQ IE clone Test</title>
6<script type="text/javascript" src="inc/jquery.js"></script>
7
8</head>
9<body>
10
11<hr />
12<p>IE's scope is the cloned element, NOT the clone. IE also auto-fires events attached to "clones" -- hence the instant removal of cloned element (not clone).</p>
13
14<div id="ex1">
15       
16        <div>
17        <input type="text" name="v" value="test" class="pV" />
18        <input type="submit" value="+" class="addValue" />
19        </div>
20       
21</div>
22
23<script type="text/javascript">
24$().ready(function(){
25    $('#ex1 input.addValue').click(function() {
26        $(this).parent().clone().appendTo('#ex1');
27       
28        $(':input:last',$('#ex1'))
29           .val('-')
30           .one('click', function() 
31                {
32                    $(this).parent().remove();
33                    return false;
34                }
35                );
36        });
37});
38</script>
39
40
41
42<hr />
43
44<p>Using a benign click event, the element is not removed. NOTICE that clones still have their donor events!</p>
45
46
47<div id="ex2">
48       
49        <div>
50        <input type="text" name="v" value="test" class="pV" />
51        <input type="submit" value="+" class="addValue" />
52        </div>
53       
54</div>
55
56<script type="text/javascript">
57$().ready(function(){
58    $('#ex2 input.addValue').click(function() {
59        $(this).parent().clone().appendTo('#ex2');
60       
61        $(':input:last',$('#ex2'))
62           .val('-')
63           .one('click', function() { return false; });;
64        });
65});
66</script>
67
68</body>
69</html>