Question

我有一个选择框，如何获取数组中的所有文本和值。

<select  data-original-title="" title="">
    <option value=""> -- Select Template -- </option>
    <option value="1">a</option>
    <option value="2">b</option>
    <option value="3">c</option>
</select>

对象数组中的所有值

如何在数组中获取单选按钮标签和值

<div class="radio">
    <label class="radio-inline">
        <input tabindex="7" onclick="hidetyping_translt()" 
            name="txtSelectedLanguage" id="txtSelectedLanguage1" value="English" 
            checked="checked" type="radio"> English </label>
    <label class="radio-inline">
        <input tabindex="8" onclick="showtyping_translt()" 
            name="txtSelectedLanguage" id="txtSelectedLanguage2" value="Other" 
            type="radio">Other Language</label>
    <label class="radio-inline">
        <input tabindex="9" onclick="hidetyping_translt()" 
            name="txtSelectedLanguage" id="txtSelectedLanguage3" value="Flash" 
            type="radio">Flash SMS</label>
</div>

Answer 1

单选按钮是“一次选择”，但是在任何情况下，您都可以在单选按钮上进行多选或选择，然后对名称属性进行选择

name="txtSelectedLanguage[]"

multiarray是

name="txtSelectedLanguage[][]"

Answer 2

我更喜欢从html元素获取数据的选项如下：

(function myFunc() {
        document.addEventListener("DOMContentLoaded", function() {
           let selectContainer = document.querySelector(".select")
           let allOptions = selectContainer.querySelectorAll("option")
           allOptions.forEach(option => {
             console.log(option.value)
           })
        })
      }())

请注意上面我如何遍历allOptions数组并获取值。您可以在forEach函数的顶部创建一个newArray，并使用newArray.push()将所有值推入数组中

<select class="select" data-original-title="" title="">
    <option value="">-- Select Template --</option>
    <option value="1">a</option>
    <option value="2">b</option>
    <option value="3">c</option>
</select>`

以下代码适用于您的广播示例：

(function myFunc() {
        document.addEventListener("DOMContentLoaded", function() {
           let radioContainer = document.querySelector(".radio")
           let newArray = []
           let allOptions = radioContainer.querySelectorAll("input")
           allOptions.forEach(input => {
             newArray.push(input.value)
           })
           console.log(newArray)
        })
      }())

<div class="radio">
    <label class="radio-inline">
        <input tabindex="7" onclick="hidetyping_translt()" name="txtSelectedLanguage" id="txtSelectedLanguage1" value="English" checked="checked" type="radio">
        English
    </label>
    <label class="radio-inline">
        <input tabindex="8" onclick="showtyping_translt()" name="txtSelectedLanguage" id="txtSelectedLanguage2" value="Other" type="radio">
        Other Language
    </label>
    <label class="radio-inline">
        <input tabindex="9" onclick="hidetyping_translt()" name="txtSelectedLanguage" id="txtSelectedLanguage3" value="Flash" type="radio">
        Flash SMS
    </label>
</div>

Answer 3

不太了解这个问题。您是否要在值和标签中使用JS数组？

尝试以下方法：

$(function() {
    var selectObj = {};
    
    // better would be if you have an ID on your select to avoid problems
    $('select option').each(function(k,v){
      selectObj[k] = $(v).html();
    });
    
    console.log(selectObj);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<select  data-original-title="" title="">
    <option value="">-- Select Template --</option>
    <option value="1">a</option>
    <option value="2">b</option>
    <option value="3">c</option>
</select>`

和您的单选按钮（但我不喜欢您的html的输出，那不是真的可以与JS一起使用）：

$(function() {
    var radioObj = {};
    
    $('.radio label').each(function(){
      var k = $('input', $(this)).attr('value'),
        v = $(this).text().trim();
      
      radioObj[k] = v;
    });
    
    console.log(radioObj);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div class="radio">
    <label class="radio-inline">
        <input tabindex="7" onclick="hidetyping_translt()" name="txtSelectedLanguage" id="txtSelectedLanguage1" value="English" checked="checked" type="radio">
        English
    </label>
    <label class="radio-inline">
        <input tabindex="8" onclick="showtyping_translt()" name="txtSelectedLanguage" id="txtSelectedLanguage2" value="Other" type="radio">
        Other Language
    </label>
    <label class="radio-inline">
        <input tabindex="9" onclick="hidetyping_translt()" name="txtSelectedLanguage" id="txtSelectedLanguage3" value="Flash" type="radio">
        Flash SMS
    </label>
</div>

如何从HTML元素获取数组对象

3 个答案: