Более короткий способ изменить содержимое при нажатии переключателя

Question

Интересно, есть ли более короткий способ сделать это:

    <script>
       $(document).ready(function() {           
        $("#deliverer").change(function() {
         $("#opttuser").hide();
         $("#optdeliverer").show();
        });
        $("#tuser").change(function() {
         $("#optdeliverer").hide();
         $("#opttuser").show();
       });
     });
    </script>
    <input type="radio" id="deliverer" value="deliverer" name="type"/>
<input type="radio" name="type" value="tuser" id="tuser" />
    <div id='optuser'>//some input fields</div>
    <div id='optdeliverer'>//some other input fields

Это работает без каких-либо проблем, но у меня есть ощущение, что это можно сделать гораздо более коротким способом. Так есть ли?

Answer 1

Попробуйте что-то вроде этого ... Я добавил checked и спрятал противоположный div, используя css ( demo ):

HTML

<input type="radio" id="deliverer" value="deliverer" name="type" checked />
<input type="radio" name="type" value="tuser" id="tuser" />
<div id='optuser'>//some input fields</div>
<div id='optdeliverer'>//some other input fields</div>

код

$(document).ready(function() {
    $("#deliverer, #tuser").change(function() {
        $("#optdeliverer, #optuser").toggle();
    });
});

1012 * CSS *

#optdeliverer { display: none; }