Javascript 隐藏/显示数据作为输入 radio

Question

我创建了一个代码，通过单击一个 RADIO 来显示信息，通过单击另一个 RADIO 来显示其他信息。

工作正常，但是当我更新页面时，即使已检查，也没有显示任何信息。然后我必须再次单击已检查信息的 RADIO 才能出现。

有人知道怎么解决吗？

请按照以下代码操作:

<script>
// COLOR BG OR IMG BG
$(document).ready(function(){ 
    $("input[name$='userBgOrImg']").click(function() {
        var test = $(this).val();
        $("div.desc").hide();
        $("#"+test).show();
    }); 
});

</script>

<style type="text/css">
    .desc { display: none; }
</style>


<div><label><input type="radio" name="userBgOrImg" value="1" <?php $id = $res_select["id"]; if ( $userBgOrImg == 1 ) { echo "checked=\"checked\"";} else { echo "";}?>>Cor de Fundo</label></div>  
<div><label><input type="radio" name="userBgOrImg" value="2" <?php $id = $res_select["id"]; if ( $userBgOrImg == 2 ) { echo "checked=\"checked\"";} else { echo "";}?>>Imagem de Fundo</label></div>  
<div> <br /> <br /> </div>
<div id="1" class="desc">
    <label for="userBgBody">Cor do fundo do Site</label>
    <input type="text" class="form-control bscp span12" value="<?php $id = $res_select["id"]; echo $userBgBody; ?>" id="userBgBody" name="userBgBody">
    <hr />
</div>

<div id="2" class="desc">
    <label for="userImgBody">Imagem de fundo do site</label>
    <input type="text" class="span12" name="userImgBody" id="userImgBody" placeholder="Imagem do fundo do site" value="<?php $id = $res_select["id"]; echo $userImgBody; ?>" />
    <hr />

    <label for="userImgBodyRepeat">Repetir imagem de fundo</label>
    <span> <input type="radio" name="userImgBodyRepeat" value="repeat"> Sim</span> <span> <input type="radio" name="userImgBodyRepeat" value="no-repeat" selected="selected"> Não
    <hr />
</div>

预先感谢您的帮助。

Answer 1

试试这个，

$(document).ready(function(){
    var did=$("input[name$='userBgOrImg']:checked").val();
    if(did)
    {
       $("#"+did).show();
    }
    // your remaining code
});// document.ready function close

Demo