0

我有这个表格： 

<form>
        <div class="box">
            <h1>Contact form :</h1>
            <label>
                <span>Typ: </span>
                <input type="radio" name="typ" value="admin" />admin<br />
                <input type="radio" name="typ" value="user" />user<br />
            </label>
            <label>
                <span>E-mail :</span>
                <input type="text" class="post" name="email" id="email"/>
            </label>
            <label>
                <span>Subject :</span>
                <input type="text" class="post" name="subject" id="subject"/>
            </label>

            <label>
                <span>If admin :</span>
                <input type="text" class="post" name="ifadmin" id="ifadmin"/>
            </label>

        </div>
    </form>

如何做这样的事情：如果我选择第一个收音机“admin”使用jquery动态显示“ifadmin”，如果我选择“user”不显示？

4

3 回答 3

0

您可以使用以下代码执行此操作。在标签上放一个class或id（这将使使用jQuery更容易操作）ifadmin

<label class="ifadmin">
                <span>If admin :</span>
                <input type="text" class="post" name="ifadmin" id="ifadmin"/>
            </label>

以及收音机show/hide的change回调。

$('input[name=typ]').on('change',function(){
        if($(this).val() == 'admin')
          $('.ifadmin').show();
       else
          $('.ifadmin').hide();           
    });

演示：http: //jsfiddle.net/joycse06/dSEzE/

阅读更多关于.show()和.hide()

于 2012-06-25T07:22:21.913 回答
0

读这个

JAVASCRIPT

function pilihanmu(){
    var val = 0;
    for( i = 0; i < document.contoh.pilihan.length; i++ ){
        if( document.contoh.pilihan[i].checked == true ){
            val = document.contoh.pilihan[i].value;
            if(val=='3'){
                document.contoh.opsional.disabled = false;      
            }
            else{
                document.contoh.opsional.disabled = true;
            }
        }
    }
}

HTML

<form name="contoh">
    <input type="radio" name="pilihan" value="1" onclick="pilihanmu()"> Google<br>

    <input type="radio" name="pilihan" value="2" onclick="pilihanmu()"> Momonimo<br>

    <input type="radio" name="pilihan" value="3" onclick="pilihanmu()"> Lainnya..<br>

            <input type="text" name="opsional" class="text" disabled="">            
</form>
于 2012-06-25T07:22:34.647 回答
0

将 id='ifadmin' 赋予<label>ifadmin 并将此代码简单地放在表单上方或头部。

 <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){

$("input:radio[name=typ]").click(function() {
    if($(this).val()=="admin")
    $("#ifadmin").css("display","none");
    else
    $("#ifadmin").css("display","block");
});




    });
    </script>
于 2012-06-25T07:27:03.677 回答