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

试试这个，我想你喜欢这个

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

小提琴Here

于 2013-10-03T08:31:25.767 回答
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 回答