Veld onbruikbaar maken
Ik heb deze code van iemand gekregen: http://jsfiddle.net/asxFt
MNaarrr ik krijg hem niet geïmplanteerd in m'n site.
Onderstaande heb ik, om te proberen, maar het werkt niet. Qat doe ik verkeerd en wie kan me helpen?
Code (php)
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
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
<!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" />
<script type="text/javascript">
$("#a").bind('input',function(){
if(! $(this).val() == ''){
$('#b').prop('disabled', true);
} else {
$('#b').prop('disabled', false);
}
});
$("#b").bind('input',function(){
if(! $(this).val() == ''){
$('#a').prop('disabled', true);
} else {
$('#a').prop('disabled', false);
}
});
</script>
<title>Naamloos document</title>
</head>
<body>
A: <input type="text" name="a" id="a">
B: <input type="text" name="b" id="b">
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
$("#a").bind('input',function(){
if(! $(this).val() == ''){
$('#b').prop('disabled', true);
} else {
$('#b').prop('disabled', false);
}
});
$("#b").bind('input',function(){
if(! $(this).val() == ''){
$('#a').prop('disabled', true);
} else {
$('#a').prop('disabled', false);
}
});
</script>
<title>Naamloos document</title>
</head>
<body>
A: <input type="text" name="a" id="a">
B: <input type="text" name="b" id="b">
</body>
</html>
Gewijzigd op 07/08/2013 18:45:55 door Roel H
Kan je de code tussen code-tags plaatsen?
In de code die hier boven staat laad je geen jQuery in.
Ik snap er eerlijk gezegd weinig van :(
Gewijzigd op 07/08/2013 19:09:43 door Roel H
Code (php)
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
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
<!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" />
<script src="http://code.jquery.com/jquery-1.9.1.js">
$("#a").bind('input',function(){
if(! $(this).val() == ''){
$('#b').prop('disabled', true);
} else {
$('#b').prop('disabled', false);
}
});
$("#b").bind('input',function(){
if(! $(this).val() == ''){
$('#a').prop('disabled', true);
} else {
$('#a').prop('disabled', false);
}
});
</script>
<title>Naamloos document</title>
</head>
<body>
A: <input type="text" name="a" id="a">
B: <input type="text" name="b" id="b">
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://code.jquery.com/jquery-1.9.1.js">
$("#a").bind('input',function(){
if(! $(this).val() == ''){
$('#b').prop('disabled', true);
} else {
$('#b').prop('disabled', false);
}
});
$("#b").bind('input',function(){
if(! $(this).val() == ''){
$('#a').prop('disabled', true);
} else {
$('#a').prop('disabled', false);
}
});
</script>
<title>Naamloos document</title>
</head>
<body>
A: <input type="text" name="a" id="a">
B: <input type="text" name="b" id="b">
</body>
</html>
Code (php)
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
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
<!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" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$("#a").bind('input',function(){
if(! $(this).val() == ''){
$('#b').prop('disabled', true);
} else {
$('#b').prop('disabled', false);
}
});
$("#b").bind('input',function(){
if(! $(this).val() == ''){
$('#a').prop('disabled', true);
} else {
$('#a').prop('disabled', false);
}
});
</script>
<title>Naamloos document</title>
</head>
<body>
A: <input type="text" name="a" id="a">
B: <input type="text" name="b" id="b">
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$("#a").bind('input',function(){
if(! $(this).val() == ''){
$('#b').prop('disabled', true);
} else {
$('#b').prop('disabled', false);
}
});
$("#b").bind('input',function(){
if(! $(this).val() == ''){
$('#a').prop('disabled', true);
} else {
$('#a').prop('disabled', false);
}
});
</script>
<title>Naamloos document</title>
</head>
<body>
A: <input type="text" name="a" id="a">
B: <input type="text" name="b" id="b">
</body>
</html>
De extensie is *.html, maar das goed neem ik aan. Zie je misschien een fout?
Edit:
Hij werkt, ik heb de code onderaan de pagina gezet!
Maarrr 1 vraagje nog. Wanneer 1 veld ingevuld is, wil ik dat bij de ander komt te staan dat die niet meer ingevuld kan worden. Is dat mogelijk?
Gewijzigd op 07/08/2013 19:39:03 door Roel H
dus: $('#a').attr('disabled', 'disabled'); en $('#a').attr('disabled', '');
niet true/false, levert soms problemen op in verschillende browsers. bovenstaande werkt.
Chris - op 07/08/2013 19:57:15:
.prop veranderen in .attr.
dus: $('#a').attr('disabled', 'disabled'); en $('#a').attr('disabled', '');
niet true/false, levert soms problemen op in verschillende browsers. bovenstaande werkt.
dus: $('#a').attr('disabled', 'disabled'); en $('#a').attr('disabled', '');
niet true/false, levert soms problemen op in verschillende browsers. bovenstaande werkt.
Je kan dan beter $('#a').removeAttr('disabled'); gebruiken ipv $('#a').attr('disabled', '');