Sitzungsspeicher von Auswahlmenü mehrere

Ich habe ein normales Auswahlmenü und ein Auswahlmenü mit Attribut multiple=yes. Wie kann ich die Werte dieses zweiten Auswahlmenüs speichern, wenn der Benutzer mehr als eine Option auswählt? Der Code funktioniert, wenn der Benutzer nur eine Option auswählt, speichert jedoch überhaupt nichts, wenn 2 oder mehr Optionen ausgewählt sind. Mein Code ist:Sitzungsspeicher von Auswahlmenü mehrere

<!DOCTYPE html> 
<html> 
<head> 
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script> 
<script src="https://github.com/yckart/jquery.storage.js"></script> 
<meta charset="utf-8"> 
<title>test</title> 

<script type="text/javascript">  
$(function() {      
$("#btn").click(function() { 

    var item1 = $("#sel option:selected").text(); 
    var item2 = $("#sel2 option:selected").text(); 

     sessionStorage.setItem("sele", item1); 
     sessionStorage.setItem("sele2", item2); 
     });  

     var ty = sessionStorage.getItem("sele"); 
     var ty2 = sessionStorage.getItem("sele2"); 

     if(ty){ 
     //Set the value of select from sessionStorage 
      $('#sel option').filter(function() { return $(this).html() == ty; }).prop('selected', true); 
      $('#sel2 option').filter(function() { return $(this).html() == ty2; }).prop('selected', true);        
     } 
    });    

    </script> 

    <script type="text/javascript">  
    $(function() { 

$("#btn2").click(function() { 

     sessionStorage.removeItem("sele"); 
     sessionStorage.removeItem("sele2"); 
     });  
    });    

    </script> 
</head> 
<body> 
<section> 
      <article> 
       <select id="sel"> 
        <option value="1">Volvo</option> 
        <option value="2">Saab</option> 
        <option value="3">Mercedes</option> 
        <option value="4">Audi</option> 
        </select> 
           <br /> 


      </article> 
      </section> 

<section> 
      <article> 
       <select id="sel2" multiple="yes"> 
        <option value="1">Volvo</option> 
        <option value="2">Saab</option> 
        <option value="3">Mercedes</option> 
        <option value="4">Audi</option> 
        </select> 
           <br /> 
         <input type="button" value="Store" id="btn" /><br> <input type="button" value="Clear" id="btn2" /> 

      </article> 
      </section> 
</body> 
</html>

Quelle

2017-05-29 xcx

Working fiddle.

Wählen Sie mehrere ein Array zurück, und man kann ein Array in session speichern, aber Sie das Array als String von Separator verketteten speichern könnte dann, wenn Sie lesen die Zeichenfolge aufgeteilt Sie diesen Separator wie erhalten mit:

$(function() { 
    var ty = sessionStorage.getItem("sele"); 
    var ty2 = sessionStorage.getItem("sele2"); 

    if(ty){ 
    //Set the value of select from sessionStorage 
    $('#sel option').filter(function() { 
     return $(this).text() == ty; 
    }).prop('selected', true); 

    $('#sel2 option').filter(function() { 
     return $.inArray($(this).text(), ty2.split('-'))>-1; 
    }).prop('selected', true);        
    } 

    $("#btn").click(function() { 
    var item1 = $("#sel option:selected").text(); 
    var item2 = []; 
    $("#sel2 option:selected").each(function(){ 
     item2.push($(this).text()); 
    }); 
    sessionStorage.setItem("sele", item1); 
    sessionStorage.setItem("sele2", item2.join('-')); 
    }); 
    $("#btn2").click(function() { 
    sessionStorage.removeItem("sele"); 
    sessionStorage.removeItem("sele2"); 
    });  
});

HINWEIS: Es ist besser zu verwenden .text() anstelle von .html() in Ihrem Fall.

Hoffe, das hilft.

Quelle

2017-05-29 18:31:13

Sitzungsspeicher von Auswahlmenü mehrere

Antwort

Verwandte Themen