带选项和p5js的SELECT元素

时间:2019-05-13 01:16:06

标签: javascript p5.js

我正在使用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>

0 个答案:

没有答案