javascript - jquery 用选择值替换文本字段值

Question

我读过这篇文章SO post并应用以下代码将文本字段替换为 HTML 选择选项。

$("#id_reason").replaceWith(
    '<select id="id_reason" name="id_reason" onchange="changeReason();"' +
        '<option value="0">Select a Reason</option>' +
        '<option value="General Query">General Query</option>' +
        '<option value="Feedback">Feedback</option>' +
        '<option value="Complaint">Complaint</option>' +
        '<option value="Translation">Translation</option>' +
        '<option selected value="Registration">Registration</option>' +
        '<option selected value="Subscription">Subscription</option>' +
        '<option selected value="Other">Other</option>' +
    '</select>');

    function changeReason() {

        //apply some code here I think!

    }

我遇到的问题是，表单无法识别原因选择列表的选定值，因为表单验证不允许原因值为空。

如何编写代码以将选择选项的值应用为提交表单时应用于原因字段的值？

我尝试将选择列表重命名为 id_reason1，但无法弄清楚如何在提交表单时将所选值应用到字段。

Answer 1

给你:

    $("#id_reason").replaceWith(
        '<select id="id_reason" name="reason">' +
            '<option value="">Select a Reason</option>' +
            '<option value="General Query">General Query</option>' +
            '<option value="Feedback">Feedback</option>' +
            '<option value="Complaint">Complaint</option>' +
            '<option value="Translation">Translation</option>' +
            '<option value="Subscription">Subscription</option>' +
            '<option value="Registration">Registration</option>' +
            '<option value="Other">Other</option>' +
        '</select>');

您有两个问题:

1. 您有一个拼写错误 - 忽略关闭选择标签；和
2. 将第一个选项的值设置为空，如图所示。