Here is my code
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="js/jquery-1.7.2.min.js"></script>
<style>
div{
border:2px solid black;
width:200px;
min-height:300px;
}
</style>
</head>
<body>
<div>
<p id="demo">This will change</p>
<input type="button" value="OK" onclick="myFunction()"/>
</div>
<script>
$(document).ready(function()
{
$("input").click(function()
{
if($("div").height("300px") === true){
document.getElementById("demo").innerHTML="HELLO WORLD!";
}
});
});
</script>
</body>
</html>
I want to do is like this, If div height is equal to 300px the "This will change" paragraph will change to Hello World on the click of a button. Sorry this is my first time on javascript
Here is my code
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="js/jquery-1.7.2.min.js"></script>
<style>
div{
border:2px solid black;
width:200px;
min-height:300px;
}
</style>
</head>
<body>
<div>
<p id="demo">This will change</p>
<input type="button" value="OK" onclick="myFunction()"/>
</div>
<script>
$(document).ready(function()
{
$("input").click(function()
{
if($("div").height("300px") === true){
document.getElementById("demo").innerHTML="HELLO WORLD!";
}
});
});
</script>
</body>
</html>
I want to do is like this, If div height is equal to 300px the "This will change" paragraph will change to Hello World on the click of a button. Sorry this is my first time on javascript
Share asked Aug 16, 2012 at 18:42 Kevin Steve ManingoKevin Steve Maningo 2522 gold badges7 silver badges16 bronze badges 02 Answers
Reset to default 8$("div").height("300px") sets the height of the div, it does not return true if the height equals 300px.
You want $('div').height() === 300
http://api.jquery./height/
I'm noticing a couple things right off the bat. First, the .height function returns the numeric value without "px". Second, you are placing a value inside the .height function,meaning you are setting its value to "300px". Lastly, you are using the === operator which only returns true if the type and value are the same. Instead, try this:
if($("div").height() == 300)
On another note, you'll eventually want to give your input and div ids and access them through those ids, just in case your markup has more than one of each later on.