用JavaScript将文本输入转换为选择元素

Question

用JavaScript将文本输入转换为选择元素

javascriptjqueryforms

19

我正在一个托管的电商平台上进行前端开发。该系统发送一个文本输入框，供客户选择要添加到购物车中的商品数量，但我更喜欢使用下拉选择框。由于没有访问此方面的标记，因此我想使用JavaScript将文本输入更改为select元素。

我使用jQuery删除了副本重复了元素，但是当我尝试向购物车添加物品时，只会添加一个物品，而不考虑

- John

4个回答

6

您没有设置字段名。将name='txtQuantity'添加到选择中。如果没有名称属性，则该字段的值将无法发送回服务器。

另外，不要在选择上设置value='1'（这不起作用），而是将selected='selected'添加到第一个选项。结果与默认情况下选择第一个选项相同。

您可能会发现，在提交按钮之后使用上述代码得到了选择。但是，这已经在另一个答案中涉及到了。

- James Gaunt

1

谢谢！不确定我错过了那个属性。 - John

1

如果您已经有一个下拉/选择列表，并且只想从标签/文本框中添加一个项目，则可以尝试以下方法：

 if ($(textBoxID).val() != '') {
                $(dropDownID)
                    .append($("<option></option>")
                        .attr('value', ($(textBoxID).val()))
                            .text($(textBoxID).val())).val($(textBoxID).val())
}

- foo-baar

0

从 <select> 中删除 type 和 value 属性，添加你遗漏的 name="txtQuantity" 属性。

- Niet the Dark Absol

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- TJ VanToll · Accepted Answer

使用replaceWith替代remove和append。此外，<select>上的type属性是不必要的，<option>节点应该在<select>内部。这里是replaceWith的文档 - http://api.jquery.com/replaceWith/。

$("#txtQuantity")
    .replaceWith('<select id="txtQuantity" name="txtQuantity" class="ProductDetailsQuantityTextBox">' +
          '<option value="1">1</option>' +
          '<option value="2">2</option>' +
          '<option value="3">3</option>' +
          '<option value="4">4</option>' +
          '<option value="5">5</option>' +
        '</select>');