javascript - 从列表菜单中获取 selectedIndex 并将其放入函数中

Question

在这里，我有一个代码function findPlaces，用于搜索框等中的放置对象。

function findPlaces(boxes,searchIndex) {
   var request = {
       bounds: boxes[searchIndex],
       types: ["museum"]
   };

这工作正常，但现在......

现在我想用列表/菜单中的值更改这种类型，所以我这样做：

//JS CODE
function findPlaces(boxes,searchIndex) {
   var request = {
       bounds: boxes[searchIndex],
       types: document.getElementById("select").selectedIndex
   };

和 HTML 代码：

<label for="select"></label>
        <select name="select" id="select">
          <option>restaurant</option>
          <option>bar</option>
          <option>museum</option>
          <option>gas_station</option>
        </select>

并且此代码不会从列表/菜单中获取值并使用新值运行函数

我该如何解决？

Answer 1

试试这个 jQuery 代码，一旦你选择了元素，你会将索引发送到 findPlaces，这会提醒它：

$("#select").change(function(){

        var values= $('#select option').map(function(){
                        return this.value;
                    }).get();
        var index=jQuery.inArray($(this).val(), values);
      
        findPlaces(boxes, index);//send index to your function

    });
 
 

在这里演示

Answer 2

您可以像这样检索选择值：

var boxes = ['a', 'b', 'c'];

function findPlaces(boxes, searchIndex) {
   var select = document.getElementById("select")
   return {
       bounds: boxes[searchIndex],
       types: select.options[select.selectedIndex].value
   };
}

document.getElementById("select").onclick = function() {

    var r = findPlaces(boxes, 2);
    alert(r.types);
};

这里的例子：http: //jsfiddle.net/zaCZw/