如何使用javascript将大量的select选项移动到另一个select控件？

我在决斗列表框控件上方有一个链接，它是“全选”。功能是将

选项从一个选择移动到另一个选择

jQuery从源代码移动到目标代码，运行良好，但现在源代码中有100000多条记录，并导致

未捕获范围错误：超过最大调用堆栈大小

在Chrome和Firefox中弹出一个无响应的脚本。以下是jQuery：

$('#' + source + ' option').remove().appendTo('#' + destination).removeAttr('selected');

---

有没有一种方法可以限制对浏览器的影响，而不会对大量的

s造成问题？

与其逐行解析，不如将整个HTML从源代码复制到目标代码，然后从源代码中删除HTML。我不完全确定您正在使用活动类做什么，但您可能只需要添加一个addClass（）或removeClass（），作为示例

$('#' + destination).html($('#' + source + ' option').html());
$('#' + source + ' option').html('');

---

这里是一个JSFIDLE，它有一个工作示例，尽管它没有100000个选项

我不是逐行解析，而是将整个HTML从源代码复制到目标代码，然后从源代码中删除HTML。我不完全确定您正在使用活动类做什么，但您可能只需要添加一个addClass（）或removeClass（），作为示例

$('#' + destination).html($('#' + source + ' option').html());
$('#' + source + ' option').html('');

---

这里是一个JSFIDLE，它有一个工作示例，尽管它没有100000个选项

我没有足够的声誉发表评论，但我想加入讨论。我甚至不能用jquery构建一个可以在google chrome中打开的select语句。我的代码是

function selectBuild() {
html = '<select id="select1">';
for (i=0;i<100001;i++) {
    html += '<option>' + i + '</option>';
}
html += '</select>';
$('#selectdiv').html(html);
html ='';
}

函数selectBuild（）{
html=''；
对于（i=0；i我没有足够的声誉发表评论，但我想加入讨论。我甚至无法构建一个可以使用jquery在google chrome中打开的select语句。我的代码是

function selectBuild() {
html = '<select id="select1">';
for (i=0;i<100001;i++) {
    html += '<option>' + i + '</option>';
}
html += '</select>';
$('#selectdiv').html(html);
html ='';
}

函数selectBuild（）{
html=''；
对于（i=0；该解决方案是开发一些其他UI小部件，允许用户访问——无论出于何种原因——100k个选项。出于好奇，哪种类型的UI会有超过100000个选项元素？我甚至从未见过超过1000个。我承认这很奇怪，这段代码是很久以前编写的。它列出了公司的所有计划1000+客户每个人有10-50个计划，你可以看到这是如何累积的。UI有一个决斗列表框设置，所以你可以对其中一个或所有计划运行一个报告，在这种情况下超过100000个。使用
选择
和100k选项。浏览器在试图打开时崩溃。@Moogs，哎哟，是的。我的负载很好，但所有选项都是coming直接从服务器格式化。解决方案是想出一些其他UI小部件，允许用户访问-无论出于何种原因-100k选项。出于好奇，哪种类型的UI会有超过100000个选项元素？我甚至从未见过超过1000个。我承认这很奇怪，这段代码是很久以前写的。它列出了所有l公司的计划有1000多个客户，每个客户有10-50个计划，你可以看到这将如何累积。用户界面有一个决斗列表框设置，因此你可以对其中一个或所有计划运行报告，在这种情况下超过100000个。使用
选择
，使用100k选项。浏览器在试图打开时崩溃。@Moogs，哎哟，是的。我的加载了不过，所有的选项都是直接从服务器格式化的。只要它运行良好，这就是我的选择。你可能会认为形式化方法会更有效，但使用原始HTML至少意味着它是由浏览器的本机代码而不是JavaScript来处理的，所以作为一个单一的操作可能会更好。@efarley，有趣的想法，我喜欢它！但唯一的问题是，由于它是一个双列表框，可能已经选择了两个项目，并且在“目标”中，这些项目将丢失。简单修复，然后将其设置为$（'#'+destination）.html（$（'#'+destination）.html（）++$（'#'+source+'选项'）.html（）；请参阅我更新的JSFIDLE。唯一可能的问题是，它们将不符合顺序，因此您可能仍然需要运行一些程序来将两个列表排序在一起。一个全面的更好的解决方案是将该列表分成多个列表。当然，这可能说起来容易做起来难，但为什么您不能为每个包含只有客户有计划。你会有很多短列表，而不是一个庞大的无法管理的列表。@efarley，doh！我需要一杯咖啡，是的，我会尝试添加html。我不认为制作1000个列表会奏效，但你让我考虑做一些类似的事情。最终拥有100000多个项目，是不可扩展的，如果我们得到了500000？非常感谢你的想法！只要它运行良好，这就是我的想法。你会认为形式化方法会更有效，但使用原始HTML至少意味着它是由浏览器的本机代码而不是JavaScript处理的，所以作为单一操作可能会更好。@efarley，有趣的想法，我喜欢它！唯一的iss但是，由于它是一个双列表框，可能已经选择了几个项目，并且在“目标”中，这些项目将丢失。简单的修复，然后将其设置为$（'#'+目标）.html（$（'#'+目标）.html（）+$（'#'+源+'选项'）.html（）；请参阅我更新的JSFIDLE。唯一可能的问题是，它们将不符合顺序，因此您可能仍然需要运行一些程序来将两个列表排序在一起。一个全面的更好的解决方案是将该列表分成多个列表。当然，这可能说起来容易做起来难，但为什么您不能为每个包含只有客户有计划。你会有很多短列表，而不是一个庞大的无法管理的列表。@efarley，doh！我需要一杯咖啡，是的，我会尝试添加html。我不认为制作1000个列表会奏效，但你让我考虑做一些类似的事情。最终拥有100000多个项目，是不可扩展的，如果我们得到50万？非常感谢你的帮助