jQuery if statements and jquery not working

many_tentacles · 01-26-2010, 02:55 PM

I have some code which works fine in traditional javascript (see code below) but I need to work by referencing the class rather than the id so I've tried to create the same functionality using jquery.

The "if" part of the statement isn't really working properly though. not sure why though.

Any help would be much appreciated.

Code:

<!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" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript" language="javascript">

$().ready(function() {
    $(".myTextBox").focus(function() {  
  		if ($(".myTextBox").attr("Value", "test")) { 
			$(".myTextBox").attr("Value", "");
			$(".myTextBox").css("color", "black");
  		}
   	});
	
	$(".myTextBox").blur(function() {  
  		if ($(".myTextBox").attr("Value", "")) { 
			$(".myTextBox").attr("Value", "test");
			$(".myTextBox").css("color", "green");
  		}
   	});
});





function clearbox() {
	if (document.getElementById('myTextBox2').value == 'test') 
		{ 
		document.getElementById('myTextBox2').value = ''; document.getElementById('myTextBox2').style.color = '#000';
		}	
}

function fillbox() {
	if (document.getElementById('myTextBox2').value == '') 
		{ 
		document.getElementById('myTextBox2').value = 'test'; document.getElementById('myTextBox2').style.color = 'green';
		}	
}

</script>

</head>

<body>
This does not work<br />
<input name="" class="myTextBox" type="text" value="test" style="color:green;" />
<br /><br /><br />
This works<br />
<input name="" id="myTextBox2" type="text" value="test" onfocus="clearbox()" onblur="fillbox()" style="color:green;" />

</body>
</html>

Fumigator · 01-26-2010, 04:33 PM

the attr() function is case-sensitive, so you must use .attr("value"). But, you can make it even easier and use jQuery's built-in .val().

http://api.jquery.com/val/