我正在使用p5js库,并从html文件中选择HTML select对象,并用一些值填充它!但是我该如何再次清除这些选项,并在创建新选项之后在变量内部循环,
我又如何循环进入选择元素选项(值)?
这是我的工作的代码段:
素描代码:
var keywordslist;
var loopbtn;
function setup() {
// put setup code here
noCanvas();
createP("<br/");
createFileInput(fileselected);
// var btn = select("#loadbtn");
createP("<br/");
//loopbtn = createButton('click me');
// loopbtn.mousePressed(processfunction);// btn.mousePressed(loadcontent);
}
function processfunction(){
keywordslist = select("#loadedkeywordslist");
log(keywordslist.get);
}
function fileselected(file){
if(file.type =="text"){
//createP(file.data);
var values = split(file.data, ",");
keywordslist = select("#loadedkeywordslist");
//keywordslist.Option("Loaded Keywords!").remove();
for (var i=0; i< values.length; i++) {
// console.log(values[i]);
// console.log(keywordslist.id());
if(values[i]!=""){
keywordslist.option( values[i],values[i]);
console.log((values[i]));
//keywordslist.clearRows();
}
}
//var loadedkeywords = loadStrings(file.data);
//console.log(loadedkeywords);
}
else{
createP("You have to select a text file");
}
}
function fileloaded (data){
createP(join(data,"<br/>"));
}
function loadcontent(){
loadStrings("rainbow.txt", fileloaded)
}
function draw() {
// put drawing code here
}
HTML code :
<body>
<h1>Welcome Instagram script ! </h1>
<select id="loadedkeywordslist" style="width: 250px;" name="loadedkeywordslist" multiple="multiple">
<!-- <option value="Loaded Keywords!">Loaded keywords ! </option> -->
<!-- <option value="opt2">Option 2</option>
<option value="opt3">Option 3</option> -->
</select>
</body>