Jump to content

fast question on hiding div content


Shadowing
 Share

Recommended Posts

I notice i cant hide table tags by using a div wrapthis makes sense to me that it should work but it doesnt

<script>$(function(){   $("#new_topic").hide();  });  </script>

<div id="new_topic"><tr><td colspan="4" align="center">Subject: <input type="text" name="subject" id="subject"maxlength="30" size="30" ></td></tr> <tr><td colspan="4" align="center"><textarea rows="10" cols="60" name="thread_content"id="thread_content"></textarea></td></tr><tr><td colspan="4" class="submit" align="center"><input type="submit" name="submit" id="submit"value="Submit Topic"></td></tr></div>

Link to comment
Share on other sites

You can't replace <table> with <div>... I mean, you can, but that's not correct. It's:

<div>  <table>    <tr>      <td></td>    </tr>  </table></div>

Link to comment
Share on other sites

if it is a simply set like below use slice() to select specific tr elements, OR target specific tr with classname and use that ref hide and show those elements

<!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.7.1/jquery.min.js"></script><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.min.js"></script><script type="text/javascript">/*<![CDATA[*//*---->*/$(function(){  $("#new_topic tr").slice(3, -2).hide();   $("#show_hide").click(function(){   if($(this).html() == "Show")      {    $("#new_topic tr").slice(3, -2).show();    $(this).html("Hide");    }    else    {    $("#new_topic tr").slice(3, -2).hide();    $(this).html("Show");    }   });   $(".show_hide").hide();   $("#show_hide2").click(function(){   if($(this).html() == "Show")      {    $(".show_hide").show();    $(this).html("Hide");    }    else    {    $(".show_hide").hide();    $(this).html("Show");    }   });    }); /*--*//*]]>*/</script><style type="text/css"></style></head><body><table id="new_topic"><tr><td>just three here untargeted1</td><td>untargeted1</td><td>untargeted1</td><td>untargeted1</td></tr><tr><td>just three here untargeted2</td><td>untargeted2</td><td>untargeted2</td><td>untargeted2</td></tr><tr><td>just three here untargeted3</td><td>untargeted3</td><td>untargeted3</td><td>untargeted3</td></tr><tr><td colspan="4" align="center">Subject: <input type="text" name="subject" id="subject"maxlength="30" size="30" ></td></tr> <tr><td colspan="4" align="center"><textarea rows="10" cols="60" name="thread_content"id="thread_content"></textarea></td></tr><tr><td colspan="4" class="submit" align="center"><input type="submit" name="submit" id="submit"value="Submit Topic"></td></tr><tr><td>just two here here untargeted1</td><td>untargeted1</td><td>untargeted1</td><td>untargeted1</td></tr><tr><td>just two here here untargeted2</td><td>untargeted2</td><td>untargeted2</td><td>untargeted2</td></tr></table><a id="show_hide" href="javascript:void(0)" >Show</a><hr /><hr /><hr /><table id="new_topic2"><tr><td>just three here untargeted1</td><td>untargeted1</td><td>untargeted1</td><td>untargeted1</td></tr><tr><td>just three here untargeted2</td><td>untargeted2</td><td>untargeted2</td><td>untargeted2</td></tr><tr><td>just three here untargeted3</td><td>untargeted3</td><td>untargeted3</td><td>untargeted3</td></tr><tr class="show_hide"><td colspan="4" align="center">Subject: <input type="text" name="subject" id="subject2"maxlength="30" size="30" ></td></tr> <tr class="show_hide"><td colspan="4" align="center"><textarea rows="10" cols="60" name="thread_content"id="thread_content2"></textarea></td></tr><tr class="show_hide"><td colspan="4" class="submit" align="center"><input type="submit" name="submit" id="submit2"value="Submit Topic"></td></tr><tr><td>just two here here untargeted1</td><td>untargeted1</td><td>untargeted1</td><td>untargeted1</td></tr><tr><td>just two here here untargeted2</td><td>untargeted2</td><td>untargeted2</td><td>untargeted2</td></tr></table><a id="show_hide2" href="javascript:void(0)" >Show</a></body></html>

Edited by dsonesuk
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...