【问题标题】:Get selectedIndex from list menu and put it in function从列表菜单中获取 selectedIndex 并将其放入函数中
【发布时间】:2013-09-16 11:45:22
【问题描述】:

这里我有一个代码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>

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

我该如何解决?

【问题讨论】:

  • 检查types'值,它应该是一个int(所选选项的索引,如名称所述)。要获得所选选项的值,您必须这样做:document.getElementById("select")[document.getElementById("select").selectedIndex].value
  • 看这里:jsbin.com/UNuRexA/5,别再工作了
  • 或者这个:jsbin.com/UNuRexA/6

标签: javascript jquery html list drop-down-menu


【解决方案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

    });
 
 

DEMO HERE

【讨论】:

  • 好的,但是如何在这里适应我的代码:jsbin.com/UNuRexA/6/editjsbin.com/UNuRexA/6
  • 我试试这个: $("#select").change(function(){ var values= $('#select option').map(function(){ return this.value; } ).get(); var index=jQuery.inArray($(this).val(), values); findPlaces(index);//向你的函数发送索引 });函数 findPlaces(boxes,searchIndex) { var request = { bounds: boxes[searchIndex], types: ["index"] }; bt 不工作
  • 我不知道 box 是什么,但你应该定义它并调用它,替换 findPlaces(index);通过 findPlaces(boxes, index);
  • 我只需要更改类型,然后更新函数 findPlaces,仅此而已! – Marco Jordan 刚刚编辑
  • 不不不,searchIndex 是不同的东西,我不能用索引来改变它
【解决方案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/

【讨论】:

  • 是的,但是我不需要改变盒子,我不需要这个数组盒子
  • "boxes" 数组只是一个例子。
  • 再次不起作用:尝试jsbin.com/UNuRexA/6/edit 或演示:jsbin.com/UNuRexA/6
  • 什么时候应该调用findPlaces?此外,您不需要使用onclick 复制该部分,其唯一目的是通过警报显示该值。
  • 我现在也试试这个: $("#select").change(function(){ var values= $('#select option').map(function(){ return this.value ; }).get(); var index=jQuery.inArray($(this).val(), values); findPlaces(index);//向你的函数发送索引 });函数 findPlaces(boxes,searchIndex) { var request = { bounds: boxes[searchIndex], types: ["index"] };但不工作
猜你喜欢
  • 2016-03-12
  • 2020-02-09
  • 1970-01-01
  • 2021-10-01
  • 1970-01-01
  • 2021-06-26
  • 2020-05-09
  • 1970-01-01
  • 2019-06-20
相关资源
最近更新 更多