在javascript單選按鈕上輸入文本字段

Question

我有三個單選按鈕

   <input type="radio" name="selection" class="selection" data-id='0' value="search" checked="checked" />Search for a client
    <input type="radio" name="selection" class="selection" data-id='0' value="sel" />Mass E-mail
    <input type="radio" name="selection" class="selection" data-id='0' value="others" onclick="getElementById('other').style.display = null;" />Other E-mail 

在選擇上，我需要更改文本字段並在不同的選擇上獲得不同的文本字段。

這是我的功能

$('.selection').live('click',function(){
        var id =  $(this).attr('data-id');
        if(id == 0){id='';}
        var selectedVal = $(this).val();
        if(selectedVal=='sel'){
            $('#customer_search_query'+id).attr('style','display:none');
            $('#customers_email_address'+id).attr('style','display:inline');
            $('#customer_id'+id).val('');
            $('#customer_search_query'+id).val('');
            $('#customers_email_address'+id).val('');
             $('#other'+id).attr('style','display:none');
        }else if(selectedVal=='search'){
            $('#customer_search_query'+id).attr('style','display:inline');
            $('#customers_email_address'+id).attr('style','display:none');
            $('#customer_id'+id).val('');
            $('#customer_search_query'+id).val('');
            $('#customers_email_address'+id).val('');
             $('#other'+id).attr('style','display:none');
        }
        else {
            $('#customer_search_query'+id).attr('style','display:none');
            $('#customers_email_address'+id).attr('style','display:none');
            $('#other'+id).attr('style','display:inline');
        }
    });

問題是，在前兩個單選按鈕上，它運行正常，但是在第三次單擊時，我需要簡單的文本字段，但它不起作用。 這是該系統上的現有腳本。 如果我錯過任何事情，請告訴我。

Answer 1

您需要從第三個控件中刪除onclick事件以通過jQuery函數（onclick =“ document.getElementById（'other'）。style.display = null;”）：

 $('.selection').live('click', function() { var id = $(this).attr('data-id'); if (id == 0) { id = ''; } var selectedVal = $(this).val(); if (selectedVal == 'sel') { $('#customer_search_query' + id).attr('style', 'display:none'); $('#customers_email_address' + id).attr('style', 'display:inline'); $('#customer_id' + id).val(''); $('#customer_search_query' + id).val(''); $('#customers_email_address' + id).val(''); $('#other' + id).attr('style', 'display:none'); } else if (selectedVal == 'search') { $('#customer_search_query' + id).attr('style', 'display:inline'); $('#customers_email_address' + id).attr('style', 'display:none'); $('#customer_id' + id).val(''); $('#customer_search_query' + id).val(''); $('#customers_email_address' + id).val(''); $('#other' + id).attr('style', 'display:none'); } else { $('#customer_search_query' + id).attr('style', 'display:none'); $('#customers_email_address' + id).attr('style', 'display:none'); $('#other' + id).attr('style', 'display:inline'); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> <input type="radio" name="selection" class="selection" data-id='0' value="search" checked="checked" />Search for a client <input type="radio" name="selection" class="selection" data-id='0' value="sel" />Mass E-mail <input type="radio" name="selection" class="selection" data-id='0' id="other" value="others" />Other E-mail