0

小提琴在这里，包含以下代码：http: //jsfiddle.net/enp2T/6/

<select id="aList">
    <option value="0">0</option>
    <option value="100">100</option>
    <option value="200">200</option>
    <option value="300">300</option>
</select>

<div id="newListContainer"></div>

$(function() {
    var value = 300;
    var clonedList = $('#aList').clone();    

    var listHtml = clonedList
        .removeAttr('id')
        .val(value)
        .wrap('<div/>')
        .parent()
        .html();

    $('#newListContainer').html(listHtml);       

    //$('#newListContainer>select').val(value);
});

我认为我选择的 300 值将被保留，但 listHtml 只包含原始列表的克隆。我处于尝试重新找到对象并在绘制后设置其值会很痛苦的情况（将其传递给另一个外部库函数将渲染推迟到以后，除非我直接修改该库，否则没有完整的回调我试图避免）。

所以我做错了什么可怕的事情吗？缺少一个怪癖？

澄清：我需要将 HTML 作为字符串传递，因为使用它的库需要一个字符串。

4

3 回答 3

3

没有理由为此进行往返标记，我怀疑这就是问题所在，因为 jQueryval设置了不会序列化selectedIndex的元素。select

只需使用克隆的元素：

var wrappedList = clonedList
    .removeAttr('id')
    .val(value)
    .wrap('<div/>')
    .parent();
// Note: Not doing `.html()` at the end

// html(...) would empty the container and then add the HTML, so
// we empty the container and then append the wrapped, cloned list
$('#newListContainer').empty().append(wrappedList);

更新的工作小提琴

于 2013-09-24T13:32:39.673 回答
0

jQuery 使用您选择的任何内容克隆列表 - 这里的问题是您没有选择任何内容，因此您正在克隆没有选定值的下拉列表（请参见此处）。

有关该脚本的更新版本，请检查此更新的 jsFiddle。

代码：

$(function() {
    var value = 300;
    var clonedList = $('#aList').clone();
    clonedList.find('option[value="' + value + '"]').attr('selected', 'selected');

    var listHtml = clonedList
        .removeAttr('id')
        .val(value)
        .wrap('<div/>')
        .parent()
        .html();

    $('#newListContainer').html(listHtml);       

    //$('#newListContainer>select').val(value);
});
于 2013-09-24T13:40:30.300 回答
0

请参阅此链接。您不能设置value为select，您必须将selected属性设置为 item with value=300。 

$(function() {
    var value = 300;
    var clonedList = $('#aList').clone();    
    clonedList.find('option[value="' + value + '"]').attr("selected", true);
    var listHtml = clonedList
        .removeAttr('id')
        //.val(value)
        .wrap('<div/>')
        .parent()
        .html();
    $('#newListContainer').html(listHtml);       

    //$('#newListContainer>select').val(value);
});

我有一个错误。@TJ克劳德是对的。jQuery 可以通过函数设置value选择。关联.val(value)

$(function() {
    var value = 300;
    var clonedList = $('#aList').clone();
    var holderCloned = clonedList.removeAttr('id').val(value).wrap('<div/>').parent();
    $('#newListContainer').empty().append(holderCloned);
});
于 2013-09-24T13:36:03.937 回答