Databases
StackOverflow2013
Postsdbo
POHow to use hide/show function in Jquery?
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to use hide/show function in Jquery?
    text
    copied!<p>I have one <code>HTML</code> page with one toggle button and some drop down item. My toggle button is like on-off.<br> What i need?? I need to hide drop down item when i click on "ON" and show drop-down when i click<br> on "off". I am very newbie on <code>HTML , CSS, JQuery</code>. Here is my code of HTML file which work only<br> for toggle. </p> <pre><code>&lt;html&gt; &lt;head&gt; &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="jquery/iphone-style-checkboxes.js" type="text/javascript" charset="utf-8"&gt;&lt;/script&gt; &lt;link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8" /&gt; &lt;style type="text/css"&gt; body {padding: 10px; } th {text-align: right;padding: 4px;padding-right: 15px;vertical-align: top; } .css_sized_container .iPhoneCheckContainer {width: 250px; } &lt;/style&gt; &lt;script type="text/javascript" charset="utf-8"&gt; $(window).load(function() { $('.on_off :checkbox').iphoneStyle(); $('.disabled :checkbox').iphoneStyle(); $('.css_sized_container :checkbox').iphoneStyle({ resizeContainer: false, resizeHandle: false }); $('.long_tiny :checkbox').iphoneStyle({ checkedLabel: 'Very Long Text', uncheckedLabel: 'Tiny' }); var onchange_checkbox = ($('.onchange :checkbox')).iphoneStyle({ onChange: function(elem, value) { $('span#status').html(value.toString()); } }); setInterval(function() { onchange_checkbox.prop( 'checked', !onchange_checkbox.is(':checked')).iphoneStyle("refresh"); return }, 2500); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;table&gt;&lt;tr class="on_off"&gt; &lt;td&gt; &lt;input type="checkbox" id="on_off" /&gt; &lt;/td&gt; &lt;/tr&gt;&lt;/table&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>I know following function use for hide and show. </p> <pre><code>$(document).ready(function(){ $("#hide").click(function(){ $("p").hide(); }); $("#show").click(function(){ $("p").show(); }); }); </code></pre> <p>But i don't understand how this function implement in <code>javascript</code>.<br> because above function work on two button and i use only one button..<br> Please give me any hint or direct me where i wrong?....</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload