Html 选择html中的所有选项动态选择
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17147077/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
select all options in html select dynamically
提问by Sanyifej?
I have two HTML selects in a form. The first is called availableand contains several options:
我在一个表单中有两个 HTML 选择。第一个被调用available并包含几个选项：
<select name="sortedby" multiple="multiple">
<option value="start">
<xsl:if test="@sortedby='start'">
<xsl:attribute name="selected">true</xsl:attribute>
</xsl:if>
Start time
</option>
<option value="thread_id">
<xsl:if test="@sortedby='thread_id'">
<xsl:attribute name="selected">true</xsl:attribute>
</xsl:if>
Thread Id
</option>
<option value="user_name">
<xsl:if test="@sortedby='user_name'">
<xsl:attribute name="selected">true</xsl:attribute>
</xsl:if>
Username
</option>
</select>
The second is called yourselectionand is empty at the beginning:
第二个被调用yourselection并且一开始是空的：
<select name="sortedby_target" multiple="multiple">
</select>
There is a button which removes the selected options from availableand moves them to yourselection.
有一个按钮可以从 中删除所选选项available并将它们移动到yourselection。
This button calls a JavaScript function from a library that I can use but can't modify.
此按钮从我可以使用但不能修改的库中调用 JavaScript 函数。
Basically it works fine. But there is a minor inconvenience: When the user moves one or several option(s) from availableto yourselection, they are not selected by default "upon arrival". So currently the user has to select an option first in availablethan move it to yourselection, and again manually select it in yourselection, and then submit the form.
基本上它工作正常。但是有一个小不便：当用户将一个或多个选项从 移动available到 时yourselection，默认情况下不会“到达时”选择它们。因此，当前用户必须先在 中选择一个选项，然后available将其移至yourselection，然后再次手动选择 中yourselection，然后提交表单。
What I want is everything that arrives to yourselectionshould be marked as selected by default. Any ideas?
我想要的是yourselection默认情况下到达的所有内容都应标记为选中。有任何想法吗？
UPDATE!I have a function that can select all elements:
更新！我有一个可以选择所有元素的函数：
function selectAllOptions(obj) {
if (!hasOptions(obj)) { return; }
for (var i = 0; i < obj.options.length; i++) {
obj.options[i].selected = true;
}
}
But the question is how to call it? I do not want to add another button for that reason.
但问题是如何调用它？出于这个原因，我不想添加另一个按钮。
There should be something like onfillor something similar in select.
选择中应该有类似onfill或类似的东西。
采纳答案by Sanyifej?
<form name="jmxForm" onsubmit="selectAllOptions(sortedby_target)">
....
</form>
function selectAllOptions(obj) {
if (!hasOptions(obj)) { return; }
for (var i=0; i<obj.options.length; i++) {
obj.options[i].selected = true;
}
}
回答by DonPaulie
<input type="submit" onclick="selectAllOptions(sortedby_target);" />
or
或者
<form onsubmit="selectAllOptions(sortedby_target);"></form>
You can get inspired here: http://demo.redmine.org/projects/asdf/issueswhen trying to change columns in a table.
尝试更改表中的列时，您可以从这里获得灵感：http: //demo.redmine.org/projects/asdf/issues。
回答by Markipe
Try this one UPDATED!
试试这个更新！
HTML
HTML
<select name="sortedby" multiple="multiple" id="sortedby" onchange="putvalue()">
<option value="start">Start time</option>
<option value="thread_id">Thread Id</option>
<option value="user_name">Username</option>
</select>
<select name="sortedby_target" id="sortedby_target" multiple="multiple" ></select>
SCRIPT
脚本
function putvalue(){
$('option[value="' + $('#sortedby_target').val() + '"]').prop('selected','');
$("#sortedby_target").append('<option value="' + $('#sortedby').val() + '" selected>' + $('#sortedby').val() + '</option>');
$("#sortedby option[value=" + $('#sortedby').val() + "]").remove();
}
I apologized for my first solution hopefully this helps.
我为我的第一个解决方案道歉，希望这会有所帮助。
If you want to be selected all the selected items, remove this line
如果你想被选中的所有项目都被选中，去掉这一行
$('option[value="' + $('#sortedby_target').val() + '"]').prop('selected','');
