如何隱藏和顯示 <tr> 在jQuery中的表單加載？

Question

以下是我的smarty模板代碼段。

<input type="radio" name="newsletter_call_to_action_status" value="1" checked='checked' onclick="select_option(this.value);" {if $data.newsletter_call_to_action_status=='1' } checked {/if}>Yes
<input type="radio" name="newsletter_call_to_action_status" value="0" onclick="select_option(this.value);" {if $data.newsletter_call_to_action_status=='0' } checked {/if}>No
<tr id="action_link_no" {if $data.newsletter_call_to_action_status=='1' }style="display:;" {else}style="display:none;" {/if}>
    <td colspan="2">&nbsp;</td>
</tr>
<tr class="action_link_yes" height="30">
    <td align="right" width="300">
        <label><b>{'Enter call to action text'|signal_on_error:$error_msg:'newsletter_call_to_action_text'}</b>  <strong style="color:red">*</strong>
        </label>
    </td>
    <td>&nbsp;
        <input type="text" name="newsletter_call_to_action_text" id="newsletter_call_to_action_text" value="{$data.newsletter_call_to_action_text}" maxlength="50" class="inputfield">
    </td>
</tr>
<tr>
    <td colspan="2">&nbsp;</td>
</tr>
<tr class="action_link_yes" height="30">
    <td align="right" width="300">
        <label><b>{'Enter call to action link'|signal_on_error:$error_msg:'     newsletter_call_to_action_link'}</b>  <strong style="color:red">*</strong>
        </label>
    </td>
    <td>&nbsp;
        <input type="text" name="newsletter_call_to_action_link" id="newsletter_call_to_action_link" value="{$data.newsletter_call_to_action_link}" class="inputfield">
    </td>
</tr>

現在，在形式負載，如果newsletter_call_to_action_status == 1 ，那么它應該顯示tr與class=action_link_yes ，並隱藏tr使用class=action_link_no當該值為0 。

我該如何實現？

Answer 1

<input type="radio" value="1" checked="checked">YES</input>
<input type="radio"  value="0">NO</input>
<table class="tbl">
    <tr class="action-yes">
        <td>Here is stuff to show on yes</td>
    </tr>
    <tr class="action-no">
        <td>stuf to show on no</td>
    </tr>
</table>


$(document).ready(function () {
    var status = $('input:radio:checked').val();
    if (status == 1) {
        $('table tr.action-yes').show();
        $('table tr.action-no').hide();
    } else {
        $('table tr.action-yes').hide();
        $('table tr.action-no').show();
    }
});

演示： http : //jsfiddle.net/zeewon/TKZn6/

Answer 2

$('#form').load(function(){
if(newsletter_call_to_action_status == 1) {
  $('.class=action_link_yes').show();
  $('.class=action_link_no').hide();
}
else {
  $('.class=action_link_yes').hide();
  $('.class=action_link_no').show();
}
});

Answer 3

嘗試這個：

$（document）.ready（function（）{

$(".radio").change(function(){

if($(this).val() == '1')

{
    $(".action_link_no").hide();

    $(".action_link_yes").show();

}

else if($(this).val() == '0')

{

    $(".action_link_yes").hide();

    $(".action_link_no").show();

}

}）;

}）;

這是.radio是單選按鈕的類別