0

にドロップダウンボックスがあります<table>：

<TR > 
    <TD colspan="2" class="text1">
        <div align="right">
            <FONT color="#000000"> 
                <INPUT name="services[]" type="checkbox" id="services[]" value="Employee ">
            </FONT>
        </div>
    </TD>

    <TD width="321" align="center" valign="top" class="text1">
        <DIV align="left">Employee</DIV>
    </TD>
</TR>

ユーザーが上記のチェック ボックスを選択すると、次のドロップダウン メニューが有効になります。

<TR> 
    <TD width="155" height="25" align="right" class="text1">
        <div align="right">Enquiry Type/For</div>
    </TD>

    <TD align="left" colspan="2" height="25">&nbsp;
        <select name = "type" id = "type">
            <!--<option value = "general">General</option>-->
            <option value = "general">General</option>
            <option value = "employee">employee</option>
            <option value = "student">student</option>
        </select>
    </TD>
</TR>

それ、どうやったら出来るの？

フィドルHere

4

5 に答える 5

2

まず、チェックボックスの ID を次のように変更しますservices。

<INPUT name="services[]" type="checkbox" id="services" value="Employee " rel="services">

次に、ドロップダウンを変更します。

<select name = "type" id = "type" disabled="disabled">

ここで、jQuery を使用します。

$(function(){
 $("[rel=services]").click(function(){
  $("#type").attr("disabled", false);
 });
});

注:typeは逆のキーワードなのでname、ドロップダウンを別のものに変更してください。

于 2013-10-03T08:28:30.753 に答える
1

以下のコードに従ってスクリプトを変更できます.....

function check() {

if (($("#check:checked").length) > 0) {
    $("#type").removeAttr("disabled");
} else {
    $("#type").attr("disabled", "disabled");

}
}

デモ用: JSFIDDLE

于 2013-10-03T09:37:06.173 に答える
0

Jquery ソリューションなし:

document.getElementById('services').onchange = function () {
  document.getElementById('type').disabled = !document.getElementById('type').disabled;
};

チェックボックスIDを「サービス」に変更し、選択に無効を追加したことに注意してください：

<select name = "type" id = "type" disabled>
于 2013-10-03T08:37:02.890 に答える
0

ここにあなたの解決策があります

page1.php

<table id='mytable'>
<TR > 
    <TD colspan="2" class="text1">
        <div align="right">
            <FONT color="#000000"> 
                <INPUT name="services[]" type="checkbox" id="services[]" value="Employee ">
            </FONT>
        </div>
    </TD>

    <TD width="321" align="center" valign="top" class="text1">
        <DIV align="left">Employee</DIV>
    </TD>
</TR>
</table>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(e) {
    $('input[name="services[]"]').change(function(){
        if(!$(this).is(":checked")) {
            $(".newRow").remove();
        } else {
            $.ajax({
                url:"page2.php",
                success: function(response) {
                    $("#mytable").append(response);
                }
            });
        }
    });
});
</script>

page2.php

<TR class="newRow"> 
    <TD width="155" height="25" align="right" class="text1">
        <div align="right">Enquiry Type/For</div>
    </TD>

    <TD align="left" colspan="2" height="25">&nbsp;
        <select name = "type" id = "type">
            <!--<option value = "general">General</option>-->
            <option value = "general">General</option>
            <option value = "employee">employee</option>
            <option value = "student">student</option>
        </select>
    </TD>
</TR>
于 2013-10-03T08:44:42.420 に答える
0

これを試してみてください、私はあなたがこれが好きだと思います

$('input[type=checkbox]').change(function()
{
    if($(this).prop('checked'))
    $('#type').show();
    else
        $('#type').hide();
});

フィドルHere

于 2013-10-03T08:31:25.767 に答える