Question

所以我必须诚恳，我在Jquery中真的是新手。我已经采用了一个脚本，允许A Select Html更改另一个Select菜单的值，将两个选定菜单的值链接起来。例如，如果我选择在第一个选择＆＃34; Logistique＆＃34;比在第二个中选择所有名为value =＆＃34; Logistique＆＃34;出现。但我真的需要通过Id而不是值来链接它们。请有人睁开我的眼睛吗？

我希望是具体的

Catégorie de Soin :<select name="Catsoin" id="Catsoin"><br />

        <option value="0">---Select---</option><br />
            <option id="1" value="Logistique" >Logistique</option><br />
            <option value="Traitement" id="2">Traitement</option><br />
            <option value="SoinsBase" id="3">    Soins de Base</option>    <br />
            <option value="Surveilrap" id="4">Surveillance rapprochée</option><br />
            <option value="Transmi" id="5">Transmission</option><br />
            <option value="Evenement" id="6">Evènements Imprévisibles</option><br />
            <option value="Prelevement" id="7">Prélèvements</option><br />
            <option value="TechInfi" id="8">Techniques Infirmière</option><br />
            <option value="RemplUS" id="9">Remplacement dans une US</option><br />
        </select><br />

<script>
    $("#Catsoin").change(function() {
        if($(this).data('options') == undefined)
        {
            /*Taking an array of all options-2 and kind of embedding it on the Catsoin*/
            $(this).data('options',$('#Soin option').clone());<br />
        }

        var id = $(this).val();
        var options = $(this).data('options').filter('[ val =' + id + ']');

        $('#Soin').html(options);
    });
</script>

Soin :<select name="Soin" id="Soin">
    <option value="Logistique"id="1">Passage</option>
    <option id="1" value="Logistique"  >Présence dans une Us</option>  
    <option value="Logistique" id="1">Rangement</option>
    <option value="Logistique" id="1">Medicarte</option>
    <option value="Logistique" id="1">Cherche du Matériel</option>
    <option value="Logistique" id="1">Transfert d'un patient</option>
    <option value="Logistique" id="1">Autre</option>
    <option value="Traitement" id="2">Préparation IV</option>
    <option value="Traitement" id="2">Préparation POS</option>
    <option value="Traitement" id="2">Administration IV</option>
    <option value="Traitement" id="2">Administration POS</option>
    <option value="Traitement" id="2">Injection IM/SC</option>
    <option value="Traitement" id="2" >Transfusion</option>
    <option value="Traitement" id="2">Aérosolthérapie</option>
    <option value="Traitement" id="2">Oxygénothérapie</option>
    <option value="Traitement" id="2">Prise en charge du R</option>
    <option value="Traitement" id="2">Autre</option>
    <option value="SoinsBase" id="3">Toilette</option>
    <option value="SoinsBase" id="3">Elimination</option>
    <option value="SoinsBase" id="3">Alimentation</option>
    <option value="SoinsBase" id="3">Soin de confort</option>
    <option value="SoinsBase" id="3">Frictions</option>
    <option value="SoinsBase" id="3">Autre</option>
    <option value="Surveilrap" id="4">Post-Op</option>
    <option value="Surveilrap" id="4">Urgences</option>
    <option value="Surveilrap" id="4">Paramètres</option>
    <option value="Surveilrap" id="4">Monitoring</option>
    <option value="Surveilrap" id="4">Patient Critique</option>
    <option value="Surveilrap" id="4">Tour Infirmier Complet</option>
    <option value="Surveilrap" id="4">Autre</option>
    /*.....there  are other select option until id="9"*/
</select>

Answer 1

正如评论中所述， ID必须是唯一的。您应该考虑使用class代替。这是一个有效的例子：

＆＃13;

 $("#catsoin").change(function() {
   var cat = $(this).val(); // this is the selected value

   $("#soin option:not(." + cat + ")").hide(); // you hide every option that don't have your selected value as a class
   $("#soin option." + cat).show(); // you only show selected options
   $("#soin").val(""); //reset the previously selected value
 });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>


<select id="catsoin"> <!-- the first selector -->
  <option value=""></option>
  <option value="Logistique">Logistique</option>
  <option value="SoinsBase">Soins de Base</option>
</select>

<select id="soin"> <!-- the second one, pseudo-dynamic -->
  <option value=""></option>
  <option value="Rangement" class="Logistique">Rangement</option>
  <option value="Medicarte" class="Logistique">Medicarte</option>
  <option value="Toilette" class="SoinsBase">Toilette</option>
</select>

    <script type="text/javascript">
       
    </script>

＆＃13;

Answer 2

您无法为那么多元素提供id属性

id必须对每个元素都是唯一的

编辑：您可以使用类属性

按ID而不是按值选择选项

2 个答案: