Question

我会保持这个简单。首先，这些是从较大的文档中提取的片段。所以，是的，我有正确的标题和来源参考等。

我有一个select框。我知道如何根据单个值选择调用该函数。我想知道当选择框允许showOnly()值时，如何专门调用此函数multiple。

select框

 <select id="select_a" name="color" multiple>
     <option selected="selected" class="options">Select desired detail</option>
     <option value="None" class="options" >None</option>        
     <option value="Investment Category" class="options">Investment Category</option>
     <option value="Company" class="options">Company</option>
     <option value="Budget Line" class="options">Budget Line</option>
     <option value="Market" class="options">Market</option>
     <option value="Organization" class="options">Organization</option>
     <option value="Segment" class="options">Segment</option>  
 </select>

那么，如何将multiple值连接到下面的函数showOnly()。使用一个值，showOnly()可能看起来像showOnly('Segment','Cars')。我知道showOnly有多个值，我想showOnly('Segment,['Cars','Boats','Planes'])。这是函数showOnly()

function showOnly(filterName, values) {
  sheet = mainViz.getWorkbook().getActiveSheet();
  if(sheet.getSheetType() === 'worksheet') {
    sheet.applyFilterAsync(filterName, values, 'REPLACE');
  } else {

    worksheetArray = sheet.getWorksheets();
    for(var i = 0; i < worksheetArray.length; i++) {
        worksheetArray[i].applyFilterAsync(filterName, values, 'REPLACE');
      }
   }
};

思考?? //感谢您的考虑。

Answer 1

 var colOfSelectedOpt = document.getElementById("select_a").selectedOptions;

 var values = [];
 for(var i=0;i<colOfSelectedOpt.length;i++) {
         values.push(colOfSelectedOpt[i].value);
    }

values应该为您提供所选项目的数组。您可以在调用之前将其传递给函数，或者在函数内传递select和get值的id。

<强>更新

function showOnly(filterName, idOfSelect) {

    var colOfSelectedOpt = document.getElementById(idOfSelect).selectedOptions;

    var values = [];
    for(var i=0;i<colOfSelectedOpt.length;i++) {
         values.push(colOfSelectedOpt[i].value);
    }      

 sheet = mainViz.getWorkbook().getActiveSheet();
     if(sheet.getSheetType() === 'worksheet') {
         sheet.applyFilterAsync(filterName, values, 'REPLACE');
      } else {

         worksheetArray = sheet.getWorksheets();
         for(var i = 0; i < worksheetArray.length; i++) {
        worksheetArray[i].applyFilterAsync(filterName, values, 'REPLACE');
       }
  }
 };

每当您调用showOnly()方法时，都会传递您想要调用此函数的select dom的id。

 <select id="select_a" name="color" onchange="showOnly('filterName', this.getAttribute('id'));" multiple>

或者如果您希望选择其他按钮，则按ID从关联的选择下拉列表中获取并id并将其传递给函数。

Answer 2

由于HTMLOptionsCollection是类似于数组的对象，我不熟悉使用Array.prototype.map（）创建所选值的新数组的任何方法。但是我们总是可以使用好的老式循环。这是ES6方法：

const select = document.getElementById('select_a');
const on_change = (event) => {
  const options = event.target.options;
  let values = [];
  for (var i = 0; i < options.length; i++) {
    if (options[i].selected) {
          values.push(options[i].value);
    }
  }

  console.log('Pass these values to your function:', values);
};

select.addEventListener('change', on_change);

JS Bin：http://jsbin.com/yemoxizaso/1/edit?js,console,output

如果你不能使用ES6，那么这就是ES5方法：

var select = document.getElementById('select_a');
var on_change = function(event) {
  var options = event.target.options;
  var values = [];
  for (var i = 0; i < options.length; i++) {
    if (options[i].selected) {
          values.push(options[i].value);
    }
  }

  console.log('Pass these values to your function:', values);
};

select.addEventListener('change', on_change);

Answer 3

有一个内置Function的对象作为名为arguments的属性，它是一个可以传递无限量值的局部变量。 arguments是类似数组的，因为它将索引它给出的每个值，并且它有几个方法，包括length。我不知道我的例子是否有效，因为没有提供这些函数和变量的一半。 collArgs()应该能够获取许多参数并以类似索引的数组方式返回值。从那里开始，我已指定values来存储arguments的值，现在可以将其传递到您的函数中。

请阅读此article以获得更好的解释和工作示例 args = new arguments（）

function collArgs() {
  for (var i = 0; i < arguments.length; i++) {
   arguments[i];
  }
  return arguments;
}

var values = collArgs();

function showOnly(filterName, values) {
  var sheet = mainViz.getWorkbook().getActiveSheet();
  if(sheet.getSheetType() === 'worksheet') {
    sheet.applyFilterAsync(filterName, values, 'REPLACE');
  } else {

    var worksheetArray = sheet.getWorksheets();
    for(var i = 0; i < worksheetArray.length; i++) {
        worksheetArray[i].applyFilterAsync(filterName, values, 'REPLACE');
      }
   }
};

将多个选择值传递给Javascript API函数

3 个答案: