2017-02-06 13 views
0

スクリプトによる選択を入力したいと思います。私は充填方法に苦しんでいます。Fill Html Selection "FontSize" by JavaScript

私は私の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++) 
    { 
    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 
    } 
} 

何かが「FillSelection」方法が間​​違っている、それはオプションの要素が関数ではありませんと言います。

誰かが間違っているか不足していることを知っていますか?

おかげ

答えて

1

ような何かはあなたが新しいOptionオブジェクト

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

を作成する必要が もう一つの解決策であり、あなたが関数に#idを渡す必要があります。

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>

+0

ありがとうたくさん!これは本当にうまくいった – peterHasemann

+0

あまりにも色を保存することは可能ですか?このような色の選択がある場合:https://hastebin.com/irihamedom.js – peterHasemann

2

ラップhtml文字列ます。またhtmlvalueを設定し、あなたが追加した後の最初の要素を作成する必要が.appendTo()

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

くそ、あなたは速かった!あなたのポイントを取る;) –

+0

ありがとう:)それはうまくいくようです – peterHasemann

0

呼び出すためにjQuery()を使用することができますjQuery()

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

でプロパティはjqueryを使用します。ここでは、この

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