选择选项更改以触发附加代码答案

【问题标题】：Select Option Change To Trigger Additional Code选择选项更改以触发附加代码
【发布时间】：2013-10-31 15:20:47
【问题描述】：

好的，所以我正在尝试编写一个脚本，该脚本将根据用户的选择显示和隐藏项目。我能够弄清楚如何使用广播组来做到这一点，但是当涉及到一个选择项目时，我就是想不通。有人知道我在这里做错了什么吗？

我的 jQuery

 $('select#contact').change(function() {
    var isPhone = $('#phone').is(':selected');
    var isEmail = $('#email').is(':selected');
    $('#cell').toggleClass('req', isPhone);

    if ( isPhone === true ) {
        $('#phoneNum').animate({'height':'show'}, 500);
    } else if ( isPhone === false ){
        $('#phoneNum').animate({'height':'hide'}, 200);
    }
    $('#Remail').toggleClass('req', isEmail);

    if ( isEmail === true ) {
        $('#emailAdd').animate({'height':'show'}, 500);
    } else if ( isEmail === false ){
        $('#emailAdd').animate({'height':'hide'}, 200);
    }
});

我的 HTML

<p>
     <label for="contact">How Would You Like Us To Contact You?</label> 
     <select id="contact" name="contact" class="req">
        <option></option>
        <option id="phone">By Phone</option>
        <option id="email">By Email</option>
     </select>
</p>
<p id="phoneNum">
    <label for="cell">Best Phone Number</label>
    <input id="cell" name="cell" type="tel" placeholder="e.g. 555-555-5555" class=""/>
</p>
<p id="emailAdd">
    <label for="Remail">Email</label>
    <input id="Remail" name="Remail" placeholder="something@something.com" type="email" class=""/>
</p>

【问题讨论】：

标签： onchange html-select jquery-selectbox

【解决方案1】：

想通了：

    $('select#contact').change(function() {
    var isPhone = $(this).find("option:selected").is('#phone');
    var isEmail = $(this).find("option:selected").is('#email');
    $('#cell').toggleClass('req', isPhone);

    if ( isPhone === true ) {
        $('#phoneNum').animate({'height':'show'}, 500);
    } else if ( isPhone === false ){
        $('#phoneNum').animate({'height':'hide'}, 200);
    }
    $('#Remail').toggleClass('req', isEmail);

    if ( isEmail === true ) {
        $('#emailAdd').animate({'height':'show'}, 500);
    } else if ( isEmail === false ){
        $('#emailAdd').animate({'height':'hide'}, 200);
    }
});

【讨论】：