Ho una selezione multipla:

<select name='strings' id="strings" multiple style="width:100px;">
    <option value="Test">Test</option>
    <option value="Prof">Prof</option>
    <option value="Live">Live</option>
    <option value="Off">Off</option>
    <option value="On">On</option>
</select>

Carico i dati dal mio database. Quindi ho una stringa come questa:

var values="Test,Prof,Off";

Come posso impostare questi valori nella selezione multipla? Ho già provato a cambiare la stringa in un array e metterlo come valore nel multiplo, ma non funziona ...! Qualcuno può aiutarmi con questo? GRAZIE!!!

Scorri il ciclo utilizzando il valore in un selettore dinamico che utilizza il selettore di attributi.

var values="Test,Prof,Off";
$.each(values.split(","), function(i,e){
    $("#strings option[value='" + e + "']").prop("selected", true);
});

Esempio di lavoro http://jsfiddle.net/McddQ/1/

in jQuery:

$("#strings").val(["Test", "Prof", "Off"]);

o in puro JavaScript:

var element = document.getElementById('strings');
var values = ["Test", "Prof", "Off"];
for (var i = 0; i < element.options.length; i++) {
    element.options[i].selected = values.indexOf(element.options[i].value) >= 0;
}

jQuery fa un'astrazione significativa qui.

Fornisci semplicemente la funzione jQuery val con un array di valori:

var values = "Test,Prof,Off";
$('#strings').val(values.split(','));

E per ottenere i valori selezionati nello stesso formato:

values = $('#strings').val();

Soluzione JavaScript ES6 pura

• Cattura ogni opzione con una querySelectorAllfunzione e dividi la valuesstringa.
• Utilizzare Array#forEachper iterare su ogni elemento valuesdell'array.
• Utilizzare Array#findper trovare l'opzione corrispondente al valore specificato.
• Imposta il suo selectedattributo su true.

Nota : Array#fromtrasforma un oggetto simile a un array in un array e quindi puoi utilizzare Array.prototypefunzioni su di esso, come trova o mappa .

var values = "Test,Prof,Off",
    options = Array.from(document.querySelectorAll('#strings option'));

values.split(',').forEach(function(v) {
  options.find(c => c.value == v).selected = true;
});

<select name='strings' id="strings" multiple style="width:100px;">
    <option value="Test">Test</option>
    <option value="Prof">Prof</option>
    <option value="Live">Live</option>
    <option value="Off">Off</option>
    <option value="On">On</option>
</select>

Fondamentalmente fai un values.split(',')e poi ripeti l'array risultante e imposta il Select.

Soluzione JavaScript ES5 pura

Per qualche motivo non usi jQuery né ES6? Questo potrebbe aiutarti:

var values = "Test,Prof,Off";
var splitValues = values.split(',');
var multi = document.getElementById('strings');

multi.value = null; // Reset pre-selected options (just in case)
var multiLen = multi.options.length;
for (var i = 0; i < multiLen; i++) {
  if (splitValues.indexOf(multi.options[i].value) >= 0) {
    multi.options[i].selected = true;
  }
}

<select name='strings' id="strings" multiple style="width:100px;">
    <option value="Test">Test</option>
    <option value="Prof">Prof</option>
    <option value="Live">Live</option>
    <option value="Off">Off</option>
    <option value="On" selected>On</option>
</select>

var groups = ["Test", "Prof","Off"];

    $('#fruits option').filter(function() {
      return groups.indexOf($(this).text()) > -1; //Options text exists in array
    }).prop('selected', true); //Set selected

questo è un errore in alcune risposte per sostituire |

var mystring = "this|is|a|test";
mystring = mystring.replace(/|/g, "");
alert(mystring);

questa correzione è corretta ma il | Alla fine dovrebbe assomigliare a questo \ |

var mystring = "this|is|a|test";
mystring = mystring.replace(/\|/g, "");
alert(mystring);