如何使用在JavaScript

多选阵列数据我有一个多选择框，我要访问在JavaScript中选择的数据。下面是代码：如何使用在JavaScript

<form onsubmit="return false;" id="multisel"> 
    <select name="a[]" id="a" multiple style="width:350px;" tabindex="4"> 
    <option value="Pedro">1</option> 
    <option value="Alexis">2</option> 
    <option value="Messi">3</option> 
    <option value="Villa">4</option> 
    <option value="Andres">5</option> 
    <option value="Sergio">6</option> 
    <option value="Xavi">7</option> 
    </select> 

    <button id="btn1" onclick="ajaxmultiselect()" type="submit" class="btn btn-primary">Save changes</button> 

    <p id="status"></p> 
</form>

这是到目前为止，我已经试过代码：

<script>  
function ajaxmultiselect(){ 
    var input = []; 
    input = document.getElementById("a").value; 
    var status = _("status"); 
    if(input == ""){ 
    status.innerHTML = "Fill out all of the form data"; 
    }else { 
    status.innerHTML = input; 
    } 
} 
</script>

当我运行的代码只给人的第一价值。我试图访问在PHP中的值，它工作正常，它将值作为数组在php中传递。为什么它不与JavaScript一样？

我也试图运行值的长度的循环，但其计算仅第一选择的长度。我想显示所有将被选中的值。

任何帮助将不胜感激。

来源

2013-05-08 Priyanshu

访问该值的更好的方法是'document.forms [0] .a.value'。 'document.forms [0]'是第一种形式，'form.a'是该形式中ID为'a'的元素。 – 2013-05-08 19:34:41

document.getElementById('a').options //All Options

这会给你的，你可以遍历选项数组。

来源

2013-05-08 19:38:22

这不会在Firefox上寿工作，也许它并不在IE工作，要么，看看这个网页，看看Mozilla已经没有实现它：https://developer.mozilla.org/en-US/docs/DOM/HTMLSelectElement – Goodwine 2013-05-08 19:53:27

采取的一点。编辑。 – 2013-05-08 20:15:18

对于给定的<select>元件，所有的所选择的选项是在selectedOptions属性。 selectedIndex属性具有第一个选定选项的索引，如果没有选择，则属性为-1。每个选项都是该元素的DOM对象，因此它们的值位于value属性中。所以：

function ajaxmultiselect(){ 
    var input = []; 
    var select = document.forms[0].a; 
    var status = _("status"); 
    var options = select.selectedOptions; 
    if(select.selectedIndex == -1){ 
    // no selection 
    status.innerHTML = "Fill out all of the form data"; 
    }else { 
    for (var i = 0; i < options.length) 
     input.push(options[i].value); 
    status.innerHTML = input.join(", "); 
    } 
}

从那里你应该能够得到任何你想要的。

来源

2013-05-08 19:44:28

我相信selectedOptions只是来自WebKit（Chrome和Opera）的东西，所以FF不适用于此，也许IE也不起作用。看看这个页面，它显示Mozilla尚未实现它：https：//developer.mozilla.org/en-US/docs/DOM/HTMLSelectElement; – Goodwine 2013-05-08 19:50:58

这是不幸 – 2013-05-08 19:53:24

因为我使用FF大气压，如果我使用Chrome其实我注意到，我会回答你一样由xD – Goodwine 2013-05-08 20:03:01

如果你想获得多项选择，你可以尝试像以下：

function GetSelectedItems() { 
      var select = document.forms[0].a; 
      var selectedList = []; 

      for (var i = 0; i < select.options.length; i++) { 
       if (select.options[i].selected) { 
        selectedList.push(select.options[i].value); 
       } 
      } 

      alert(Array.join(selectedList, ",")); 
     }

来源

2013-05-08 19:44:30 CSharpConductor

嗨，感谢您的回复，我确实设法显示选定选项的csv（在您的代码帮助下）。现在，我怎么能检查它是否加入后的行为？有什么办法可以显示它，我想这样做，因为我将最终结果传递给了一个AJAX请求到php，但是响应是空白的。 – Priyanshu 2013-05-08 20:25:36

因此，而不是Array.join，你可以返回数组对象。 Array.join将其转换为字符串。在我的示例中，只需返回selectedList来代替警报。 – CSharpConductor 2013-05-08 20:32:10

当我从你的例子中显示selectedList，而不使用AJAX时，它显示一个csv。但是当我通过ajax发送相同的selectedList时，响应文本是空白的。此外，PHP识别selectedList作为一个数组，因为我没有从我在代码中使用的foreach循环中得到任何错误。当我发送警报时，php不会将其视为数组。 – Priyanshu 2013-05-08 20:49:27

你可以做到以下几点：

function getSelectedOptions(element) { 
    // validate element 
    if(!element || !element.options) 
     return []; //or null? 

    // return HTML5 implementation of selectedOptions instead. 
    if (element.selectedOptions) 
     return element.selectedOptions; 

    // you are here because your browser doesn't have the HTML5 selectedOptions 
    var opts = element.options; 
    var selectedOptions = []; 
    for(var i = 0; i < opts.length; i++) { 
     if(opts[i].selected) { 
      selectedOptions.push(opts[i]); 
     } 
    } 
    return selectedOptions; 
}

，然后改变你的ajaxmultiselect()所以你叫它像这样：

input = getSelectedOptions(document.getElementById("a"));

您将不得不迭代val你好。

来源

2013-05-08 19:47:56 Goodwine

如何使用在JavaScript

回答

相关问题