Remplir la sélection Html "FontSize" par JavaScript

Question

Je veux remplir ma sélection par script. Je me bats avec la méthode de remplissage.

Quand je veux remplir mon FontSizeMenu J'utilise ce code:

function FillFontSizeMenu() { // run this at Start 
    FillSelection(GetPossibleFontSizes(), "fontSizeMenu"); // Fill the selection with values 
} 

function GetPossibleFontSizes(){ // Return all values for the menu 
    var sizeMin = 1; 
    var sizeMax = 100; 
    var possibleSizes = []; 
    for(var i = sizeMin; i <= sizeMax; i++) 
    { 
    possibleSizes.push(i); 
    } 
    return possibleSizes; 
} 


function FillSelection(possibleValues, elementId){ // Fill the menu 
    for(var i = 0; i < possibleValues.length; i++) 
    { 
    var optionElement = "<option></option>"; // add one option element per value 
    optionElement.html(possibleValues[i]); 
    optionElement.val(possibleValues[i]); 
    $(elementId).append(optionElement); // add the option element to the selection 
    } 
} 

Quelque chose ne va pas avec la méthode « FillSelection », il dit l'élément d'option n'est pas une fonction.

Est-ce que quelqu'un sait ce qui est faux ou manquant?

Merci

Answer 1

Voici une solution plus Vous devez créer un nouvel objet Option

$(elementId).append(new Option("Font size "+i, possibleValues[i])); 

et vous devriez passer #id à fonctionner:

FillSelection(GetPossibleFontSizes(), "#fontSizeMenu") 

function FillFontSizeMenu() { // run this at Start 
 
    FillSelection(GetPossibleFontSizes(), "#fontSizeMenu"); // Fill the selection with values 
 
} 
 

 
function GetPossibleFontSizes(){ // Return all values for the menu 
 
    var sizeMin = 1; 
 
    var sizeMax = 100; 
 
    var possibleSizes = []; 
 
    for(var i = sizeMin; i <= sizeMax; i++) 
 
    { 
 
    possibleSizes.push(i); 
 
    } 
 
    return possibleSizes; 
 
} 
 

 
function FillSelection(possibleValues, elementId){ // Fill the menu 
 
    for(var i = 0; i < possibleValues.length; i++) 
 
    { 
 
    $(elementId).append(new Option("Font size "+i, possibleValues[i])); // add the option element to the selection 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button onclick="FillFontSizeMenu()">Populate it</button> 
 
<select id="fontSizeMenu"> 
 
</select>

Answer 2

chaîne Wrap html dans jQuery()

var optionElement = $("<option></option>"); 

Vous pouvez également utiliser jQuery() pour définir html, value et appelez .appendTo()

$("<option></option>", { 
    html: possibleValues[i], 
    value: possibleValues[i], 
    appendTo: $(elementId) 
}); 

Answer 3

Vous devez créer un premier élément puis ajouter propriétés utilisant jquery. Quelque chose comme ça

var ele = document.createElement("<option>"); 
$("body").append(ele); 
$(ele).html(possibleValues[i]); 
$(ele).val(possibleValues[i]);