jQuery在提交之前将动态加载的Ajax选择列表的输入附加到另一个表单

对于这个问题，让我简化我的代码：

我有两个id为“header”和“existing”的html表单

在“existing”表单中，我有一个select元素，其中选项列表根据搜索结果使用Ajax动态加载-这在以下jQuery中运行良好：

$(document).ready(function() {
    $('#article').keyup(function() {
        var getData = 'q=' + this.value + '&s=' + $('#supplierCode').val();
        $.getJSON('article.php', getData, function(j) {
            var options = '';
            for (var i = 0; i < j.length; i++) {
                options += '<option value="' + j[i].optionValue + '">' + j[i].optionDisplay + '</option>';
            }
            $('select#articleList').html(options);
        });

        return false;
    });
});

但是无论我从选项列表中选择什么，$\u请求数据总是显示列表中的第一项

---

如果有必要，我可以添加更多的代码，但希望问题的存在是清楚的

如果要研究Jquery插件的工作方式

该插件使用

创建项目列表，并将所选元素的值存储在

中

我相信这样做是为了解决动态填充的

列表的问题

---

您也可以这样做，作为问题的解决方案。

我建议您使用库进行此类操作。将非常适合您的需要。

$\u请求的具体内容是什么？你说的是php吗？是的，这都是500行php脚本的一部分。。。我将看一看Select2-Thanksy通过使用此插件将输入从
重新构造为正常
，从而解决了问题。其他代码都不需要更改，我得到了更好的下拉菜单。一石二鸟！谢谢…很高兴能帮上忙。提示：如果可能的话，使用插件代替自建解决方案。这些插件将更加健壮，即使不是日常程序员的全部问题，也能解决大部分问题。
$(document).ready(function() {
    $('#articleList').change(function() {
        $('#existing :input').not(':submit').clone().hide().appendTo('#header');
        $('#header').submit();
    });
});