Question

我的HTML页面上有一个选择字段，其中填充了一些默认项目。在AJAX的帮助下，我用适当的选项替换了选择字段中的内容（选项）。

如何将选择字段的内容（选项）存储到变量中，然后再将其加载到选择中？能够取回选择字段的默认选项会很有帮助。

谢谢！

Answer 1

~~您可以对原始元素使用jQuery's .clone() method，以便保留对原始状态副本的引用。~~

var $default_opts = $('#mySelect').children()//.clone();

我在这里使用了jQuery's .children()，以便在您使用<optgroup>元素时更加通用。

当需要恢复原件时，您可以执行以下操作：

$('#mySelect').empty().append( $default_opts.clone() );

这会清空其当前内容的<select>，并附加默认值的副本，以便您的副本保留其原始状态。

编辑：我误读了部分问题。您不需要第一个.clone()。

Answer 2

如果要恢复对象而不是html（） - 字符串，可以使用detach（）

//remove options from select and hold them inside a variable
var defaults=$('select option').detach();

//clear select and restore the defaults
$('select').empty().append(defaults);

如何将其与replaceWith()一起使用的示例：

<select id="target" size="3">
 <option>a
 <option>b
</select>
<input type="button" 
   value="replace"
   onclick="fx($('#target'),this)"
   />

<script  type='text/javascript'>
function fx(o,b)
{
 if(b.value==='replace')
 {
  o.data('defaults',$('option',o).replaceWith('<option>1</option><option>2</option>'));
  $(b).val('restore');
 }
 else
 {
  $(o).empty().append($(o).data('defaults'));
  $(b).val('replace');
 }
}
</script>

http://jsfiddle.net/doktormolle/Sgn72/

Answer 3

我的方法是使用jQuery的.data函数存储选项html。

select_box = $("#select-box");
select_box.data("orginal_options", select_box.html());
select_box.html("<option value='1'>New Option</option>");

重新安排：

select_box.html(select_box.data("original_options"));

当然这些都是基本的想法，因为我不知道你的逻辑是怎样的。（如果我错了，请纠正我。）

jQuery：将select-box的内容存储到变量中？

3 个答案: