Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Test </title>
    <style type="text/css">
      label.disabled select { opacity: 0.5; filter: alpha(opacity=50); background-color:#000; }
    
    </style>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    
    <script type="text/javascript">
      $(function() {
        $('div.formdiv').bind('click',function() {
          $('label.disabled',this).removeClass('disabled');
          $('input:radio',this).attr('checked',true);
          $('div.formdiv').not(this).find('label').addClass('disabled').find('select').attr('selectedIndex',0);
        }).find('label').addClass('disabled');
      });
    </script>
    </head>
    
    <body>
    
    <div class="formdiv">
      <label for="Name">
        <input id="Name" name="radio1" type="radio" />Name:
        <select name="select1">
          <option value="Rose">Rose</option>
          <option value="Lily">Lily</option>
        </select>
        </br>
      </label> 
    </div>
    
    <div class="formdiv">
      <label  for="Colours">
      <input id="Colours" name="radio1" type="radio" />Colour: 
      <select name="select2">
        <option value="Red">Red</option>
        <option value="Green">Green</option>
      </select>
        </label> 
      </br>
     </div> 
    
    <div class="formdiv">  
     <label  for="Sport">
      <input id="Sport" name="radio1" type="radio" />Sport: 
      <select name="select3">
        <option value="Tennis">Tennis</option>
        <option value="Cricket">Cricket</option>
      </select>
      </label> 
      </br>
    </div>
      </body>
    </html>
 
document.getElementById("hello").innerHTML = "Hello World - this was inserted using JavaScript";
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers