Как отключить выбор параметров тега через jQuery?Нужна помощь

Question

У меня есть запрос относительно выбора тегов. PLZ любой решить через JQuery. Предположим, у меня есть два тега выбора, в первом теге выбора у меня есть опции языков и сценариев, а во втором теге выбора у меня есть опции относительно языков и сценариев. Проблема в том, что если я выбираю языки из первого тега выбора, то во втором теге должна отображаться только опция «языки». Как

<select id="Languages">
    <option value="0">--Select--</option>
    <option value="1">Languages</option>
    <option value="2">Scripting</option>
</select>
<select id="Scripting">
    <option value="0">--Select--</option>
    <option value="1">C#</option>
    <option value="2">VB</option>
    <option value="3">PHP</option>
    <option value="4">jQuery</option>
    <option value="5">javascript</option>
</select>

Теперь, если я выберу опцию Language, будут видны только C #, VB и PHP, а все остальные опции будут отключены.

Answer 1

мьютекс выбирает:

<select name="st[]" prev_value="">
   <option value=""></option>
   <option value="1">1</option>
   <option value="2">2</option>
</select>
<select name="st[]" prev_value="">
   <option value=""></option>
   <option value="1">1</option>
   <option value="2">2</option>
</select>
<script>
$("select[name='st[]']").live('change', function()
                                        {if (this.value)
                                            {$("select[name='st[]'] option[value='"+this.value+"']:not(:selected)").remove();
                                            }
                                         if ($(this).attr('prev_value'))
                                            {var prev_option=$(this).find("option[value='"+$(this).attr('prev_value')+"']");
                                             $("select[name='st[]']").not(this).append(prev_option.clone());
                                            }
                                         $(this).attr('prev_value', this.value);
                                        }
                             );
</script>

Answer 2

Вот базовый шаблон, который позволяет относительно легко настроить:

var languagePairings = {
    language1: ['languageA', 'languageB'],
    language2: ['languageC', 'languageD']
};

$(function() {
    $('#select1').change(function() {
        var $select2 = $('#select2'),
            val = $(this).val(),
            availableLanguages = languagePairings[val];
        if (availableLanguages && availableLanguages.length) {
            for (var i = 0; i < availableLanguages.length; i++) {
                var lang = availableLanguages[i];
                $select2.append($('<option />').attr('value', lang).text(lang));
            }
        } else {
            $select2.empty();
        }
    });
});

Answer 3

Сначала ознакомьтесь со статьей на Выбрано из jquery .Я полагаю, ваш код будет выглядеть примерно так:

<select name="select1" id="select1">
  <option class="script">Scripting</option>
  <option class="language">Languages</option>
</select>

<select name="select2" id="select2">
  <option class="script">javascript</option>
  <option class="language">C#</option>
  <option class="script language">jQuery</option>
</select>

<script type="text/javascript">
  $("#select1").change(function () {
    $("#select2 option").disabled = true;
    $("#select1 option:selected").each(function () {
       var classname = $("#select1").attr("class");
       $("#select2 ."+classname).disabled = false;
     });
    })
  .trigger('change');
</script>

Это код psuedo, не по назначению, вам, возможно, придется немного его пересмотреть, но общая идея заключается в том, чтоВы должны назначить класс для параметров и использовать эти значения класса, чтобы контролировать, какие параметры доступны во второй таблице.

Редактировать: похоже, что Hide работает с параметрами, поэтому вы можете заменить "disabled = [boolean]msgstr "вызовы выше с .show () или .hide () соответственно.Также проверьте этот предыдущий вопрос:

Скрыть параметры в списке выбора с помощью jQuery

Answer 4

Вы можете сделать 2 подхода к этому.

1. Иметь строку в начале идентификаторов на элементах параметров, например:

Lang Script

Lang 1 Script 1

При первом выборе связать событие при изменении.

$('#first_select').change(function () {
    var type = $(this).attr('id');
    $('#second_select option').hide() // Hide all to just show the ones matching type
    $('#second_select option[id^=' + type + ']').show()
});

Два: Почти то же самое, но вместо этого вы используете 1 выбор для каждого из типов в первом элементе выбора. А на смену аде и покажи соответствующий.

.. Фредрик