在选择另一个组合框的选项时禁用组合框 - disabling combo box on selection of option of another combo box

如果第一个组合框选择是"形成性"选项，我想禁用第二个组合框。我想在不刷新页面的情况下完成这项工作，而且我使用的是PHP。有人能帮忙吗？

附言：如果用户选择"subactive"选项，当他/她选择该选项时，我希望获得变量中的第二个组合框值。

我真的被困了，因为我是PHP的新手。如果有人能帮助我，我将不胜感激。

以下是代码：

echo'<select> <option valuet=" " selected="selected">Choose one</option>';
echo '<option valuet=1>formative</option>';
echo '<option valuet=2>Submative</option>';
echo "</select>";
$quizzes.... //query to get data from sql
echo'<select> <option valuer=" " selected="selected">Choose....</option>';
foreach($quizzes as $id2 => $name) 
{
echo "<option valuer=".$id2.">".$name."</option>";
}
echo "</select>";

编辑：已解决

感谢所有帮助我的人，你真的解决了我的问题：）

这就是解决我未来使用问题的答案：

<script type="text/javascript">
$(document).ready(function() {
$('#combo_1').change(function(){
    if($(this).val() === '1'){
        $('#combo_2').attr('disabled', 'disabled');
    }else{
        $('#combo_2').attr('disabled', false);
    }
});
});

和在PHP中：

echo '<select id="combo_1">'; 
echo '<option value=" " selected="selected">Choose one</option>';
echo '<option value="1">formative</option>';
echo '<option value="2">Submative</option>';
echo '</select>';
$quizzes = $DB->get_records_menu('quiz', array('course' =>$courseid),'','id, name');
echo '<select id="combo_2">';
echo '<option value=" " selected="selected">Choose....</option>';
foreach($quizzes as $id2 => $name) {
  echo '<option value=' . $id2 . '>' . $name . '</option>';
}
echo '</select>';

你不能直接用PHP来做，你可以在你的页头中包含jQuery文件

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

然后写下：

<script type='text/javascript'>
$(document).ready(function() {
    $('#my_sel').change(function(){
        if($(this).val() === '1'){
            $('#second').attr('disabled', 'disabled');
        }else{
            $('#second').attr('disabled', false);
        }
    });
});
</script>

并将您的php更改为：

echo'<select id="my_sel"> <option valuet=" " selected="selected">Choose one</option>';
echo '<option valuet=1>formative</option>';
echo '<option valuet=2>Submative</option>';
echo "</select>";

$quizzes.... //query to get data from sql
echo'<select id="second"> <option valuer=" " selected="selected">Choose....</option>';
foreach($quizzes as $id2 => $name) 
{
echo "<option valuer=".$id2.">".$name."</option>";
}
echo "</select>";

在这里测试

试试这个JavaScript/jQuery解决方案：

<script type="text/javascript">
$(document).ready(function() {
    $('#combo_1').change(function () {
        $('#combo_2').attr('disabled', (this.val() === '1' ? 'disabled' : ''));
    });
});
</script>

并更改您的PHP代码如下：

echo '<select id="combo_1">';
echo '<option value=" " selected="selected">Choose one</option>';
echo '<option value="1">formative</option>';
echo '<option value="2">Submative</option>';
echo '</select>';
$quizzes.... //query to get data from sql
echo '<select id="combo_2">';
echo '<option value=" " selected="selected">Choose....</option>';
foreach($quizzes as $id2 => $name) {
     echo '<option value=' . $id2 . '>' . $name . '</option>';
}
echo '</select>';

尽量保持风格一致；大括号、引号等。坚持一个，它会对你有所帮助。并根据验证器检查HTML，这有助于避免错误。

使用jquery，您可以这样做：

以HTML形式给出：

<select id='firstSelect'><option>...</option></select>
<select id='secondSelect'><option>...</option></select>

这是javascript：

$('#firstSelect').change(function(event){
  switch (event.target.value){
    case '1'://formative
      $('#secondSelect').disable();
      break;
    case '2'://submative
      var valueYouWant = $('#secondSelect').value;
    default:
      $('#secondSelect').enable();
  }
});

添加jQuery库。

试试这个：

echo'<select> <option valuet=" " onchange="change_select(this)" selected="selected">Choose one</option>';
echo '<option valuet=1>formative</option>';
echo '<option valuet=2>Submative</option>';
echo "</select>";

$quizzes.... //query to get data from sql
echo'<select name="second"> <option valuer=" " selected="selected">Choose....</option>';
foreach($quizzes as $id2 => $name) 
{
echo "<option valuer=".$id2.">".$name."</option>";
}
echo "</select>";
    <script type="text/javascript">
        function change_select(args) {
            if ($(args).val() == "1") {
                $('[name="second"]').prop('disabled', 'disabled');
            }
        }
    </script>