jQuery动态添加选择 [英] jQuery dynamic added select

问题描述

当我通过克隆将动态选择添加到DIV时，我无法从新的下拉列表中选择任何内容，为什么?

When I add a select dynamic to a DIV via clone, I'm not able to select anything from the new dropdown, any ideas why?

$(".inline-form .copyIng:first-child").clone().appendTo(".inline-form");

查看此内容: http://jsfiddle.net/rxwL6/

.trigger("refresh"); Dosen't change anything, I still can't select anything from the new dropdown.

推荐答案

问题是您正在克隆jQM已增强"功能而不是原始标记的html内容.因此，jQM不知道如何创建或刷新它.

Problem is that you are cloning html content that has already been 'enhanced' by jQM and not the original markup. Therefore jQM does not know how to create or refresh it.

相反，如果您提前知道标记，只需像这样插入即可:

Instead, if you know the markup ahead of time, just insert it like this:

$(document).on("pageinit", function () {
    $("#newIng").click(function () {
        var tocopy = $('<div class="copyIng"><div class="left"><input type="text" name="m" placeholder="Some text" /></div> <div class="ingDiv"><select size="1" name="c"><option value="">No 1</option><option value="">No 2</option><option value="">No 3</option></select></div></div>');       
        $(".inline-form").append(tocopy);
        $(".copyIng").trigger("create");
    });
});

这是您更新后的 FIDDLE

here is your updated FIDDLE

更新: 从评论. OP希望克隆下拉列表中的选项列表，因此不必每次都从数据库中检索它们.这是获取选项列表并将其仅插入附加的新文本中的示例:

UPDATE: From comment. OP is interested in cloning the list of options in the dropdown so they don't have to be retrieved from database each time. Here is an example of getting the option list and inserting just that into the new text beeing appended:

$(document).on("pageinit", function () {
    $("#newIng").click(function () {
        var optList = $(".ingDiv select").eq(0).html();                
        var tocopy = $('<div class="copyIng"><div class="left"><input type="text" name="m" placeholder="Some text" /></div> <div class="ingDiv"><select size="1" name="c">' + optList + '</select></div></div>');      
        $(".inline-form").append(tocopy);
        $(".copyIng").trigger("create");
    });
});

更新了 FIDDLE

updated FIDDLE

这篇关于jQuery动态添加选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！