Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/82.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 从现有数组创建HTML表_Javascript_Jquery_Html - Fatal编程技术网

Javascript 从现有数组创建HTML表

Javascript 从现有数组创建HTML表,javascript,jquery,html,Javascript,Jquery,Html,我创建了一个数组,其中包含一些汽车品牌的列表,并在此基础上创建了一些包含这些汽车的精选标签。在每个选择标签旁边,有一个文本字段,可以在其中键入所选汽车的价格。我想做的是,单击“单击”按钮后,创建一个表格,其中包含所有选定汽车的品牌以及键入的价格。到目前为止,我已经能够用汽车品牌创建表格,但我不知道如何将价格包含在相邻的单元格中。 以下是HTML代码: <label>Item 1 </label><select class="cars"></select&

我创建了一个数组,其中包含一些汽车品牌的列表,并在此基础上创建了一些包含这些汽车的精选标签。在每个选择标签旁边,有一个文本字段,可以在其中键入所选汽车的价格。我想做的是,单击“单击”按钮后,创建一个表格,其中包含所有选定汽车的品牌以及键入的价格。到目前为止,我已经能够用汽车品牌创建表格,但我不知道如何将价格包含在相邻的单元格中。 以下是HTML代码:

<label>Item 1 </label><select class="cars"></select><label>Price</label> <input type="text" /><br /><br />
<label>Item 2 </label><select class="cars"></select><label>Price</label> <input type="text" /><br /><br />
<label>Item 3 </label><select class="cars"></select><label>Price</label> <input type="text" /><br /><br />
<label>Item 4 </label><select class="cars"></select><label>Price</label> <input type="text" /><br /><br />
<label>Item 5 </label><select class="cars"></select><label>Price</label> <input type="text" /><br /><br />
<label>Item 6 </label><select class="cars"></select><label>Price</label> <input type="text" /><br /><br />
<input type="text" id="value" />
<input type="button" value="Click" id="addNew" />
<table width="200" border="1" cellspacing="1" cellpadding="1" id="table">
  <tr>
    <th>Product</th>
    <th>Amount</th>
  </tr>

</table>
项目1价格

第2项价格

第3项价格

第4项价格

第5项价格

第6项价格

产品 数量
这是jQuery代码

//Tabela produktów
var cars = new Array(
'BMW',
'Audi',
'Mazda',
'Toyota',
'Ford',
'Honda',
'VW',
'Opel'
)
//Sortowanie tabeli alfabetycznie
cars.sort();
//Tworzenie listy rozwijanej
$(document).ready(function(){
    for(i=0;i<cars.length;i++){
        $(".cars").append("<option>"+ cars[i] +"</option>");
        }
    });
//Tworzenie tabeli
$(document).ready(function(){
    $("#addNew").click(function(){
        $("select").each(function(){
            var x = $(this).val();
            $("#table").append("<tr><td>"+x+"</td><td></td></tr>");
                });
        });
    });
//Tabela produktów
var cars=新阵列(
“宝马”,
“奥迪”,
“马自达”,
"丰田",,
“福特”,
"本田",,
“大众”,
“欧宝”
)
//索托瓦尼·塔贝利·阿尔法贝特兹尼酒店
汽车。分类();
//Tworzenie listy rozwijanej
$(文档).ready(函数(){
对于(i=0;iTry

var cars=新阵列(
“宝马”,
“奥迪”,
“马自达”,
"丰田",,
“福特”,
"本田",,
“大众”,
“欧宝”
)
//索托瓦尼·塔贝利·阿尔法贝特兹尼酒店
汽车。分类();
//Tworzenie listy rozwijanej
$(文档).ready(函数(){
对于(i=0;i

var cars = new Array(
    'BMW',
    'Audi',
    'Mazda',
    'Toyota',
    'Ford',
    'Honda',
    'VW',
    'Opel'
)
//Sortowanie tabeli alfabetycznie
cars.sort();
//Tworzenie listy rozwijanej
$(document).ready(function () {
    for (i = 0; i < cars.length; i++) {
        $(".cars").append("<option>" + cars[i] + "</option>");
    }
});
//Tworzenie tabeli
$(document).ready(function () {
    $("#addNew").click(function () {
        $("select").each(function () {
            var x = $(this).val();
          $("#table").append("<tr><td>" + x + "</td><td>" + $(this).nextUntil("input[type=text]").next().val() + "</td></tr>");
        });
    });

});