Question

我在我的新项目中使用了两个jQuery插件：

$("input[type=text].color").miniColors();
$("input[type=file], input[type=radio], input[type=checkbox], select").uniform();

在这个项目中，我有多个使用jQuery动态构建的上传表单 - 我有一个隐藏的容器<div>，其中包含多个表单元素。根据用户选择，所需的元素将添加到具有html()功能的表单中。

用户可以使用标签（Twitter Bootstrap）在多种类型的表单之间切换。

我注意到插件在这些表单元素上无法正常工作。

是否有可能将函数绑定到具有live()函数的表单，还是有其他方法？

**编辑** 正在使用以下功能构建表单：

function buildForm(target)
{
    var form = $("#" + target);

    switch(target){
        case 'image':
            form.html($("#wrapper-title").html() + $("#wrapper-src").html());
            break;
        case 'generate':
            form.html($("#wrapper-title").html() + $("#wrapper-src").html() + $("#wrapper-generate").html());
            break;
        case 'video':
            form.html($("#wrapper-title").html() + $("#wrapper-url").html());
            break;
        case 'text':
            form.html($("#wrapper-title").html() + $("#wrapper-body").html());
            break;
    }
}

所有元素都放在表单之外，并在用户更改表单类型时在<form>标记之间移动。

什么不起作用？例如，在Uniform插件中，无线电/选择按钮的状态不会更改（图形未被更改）。

干杯！

Answer 1

在仅针对新添加的表单的switch / case语句之后初始化buildForm方法内的插件。

function buildForm(target)
{
    var form = $("#" + target);

    switch(target){
        case 'image':
            form.html($("#wrapper-title").html() + $("#wrapper-src").html());
            break;
        case 'generate':
            form.html($("#wrapper-title").html() + $("#wrapper-src").html() + $("#wrapper-generate").html());
            break;
        case 'video':
            form.html($("#wrapper-title").html() + $("#wrapper-url").html());
            break;
        case 'text':
            form.html($("#wrapper-title").html() + $("#wrapper-body").html());
            break;
    }
    $("input[type=text].color", form).miniColors();
    $("input[type=file], input[type=radio], input[type=checkbox], select", form).uniform();
}

jQuery插件和动态生成的表单

1 个答案: