首页 > 解决方案 > Jquery单选按钮追加问题

问题描述

我正在使用 Jquery 和单选按钮,我没有什么问题。

这是我的单选按钮数据

data =
{"seats":[
{"id":11,"number":11,"theater":3},
{"id":12,"number":12,"theater":3},
{"id":13,"number":13,"theater":3},
{"id":14,"number":14,"theater":3},
{"id":15,"number":15,"theater":3}
]}

这是我将标签和单选输入附加到空 div 的函数

for(i = 0; i < data.seats.length; i++){
                    var newData = data.seats;
                    var radioBtn = $('<label for="seat"><input type="radio" name="seat" />'+ newData.number +'</label>');
                    radioBtn.appendTo('#radioSeats');
                    console.log(newData);
                }

我的问题是标签文本得到未定义的值,并且 console.log(newData) 打印 5 个数组(5x 个座位)

标签: jqueryjsonradio-button

解决方案


您缺少访问数组元素的索引。

var newData = data.seats[i]

data =
        {"seats":[
        {"id":11,"number":11,"theater":3},
        {"id":12,"number":12,"theater":3},
        {"id":13,"number":13,"theater":3},
        {"id":14,"number":14,"theater":3},
        {"id":15,"number":15,"theater":3}
        ]};
        
for(i = 0; i < data.seats.length; i++){
                    var newData = data.seats[i];
                    var radioBtn = $('<label for="seat"><input type="radio" name="seat" />'+ newData.number +'</label>');
                    radioBtn.appendTo('#radioSeats');
                    console.log(newData);
                }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="radioSeats">
</div>


推荐阅读