克隆的jquery表单清除所有文本框值时应该只清除一个

时间:2014-07-09 08:59:27

标签: jquery

这是我的表单形象,可以让您更好地理解

enter image description here

它的工作方式是,当您单击添加图像时,它将克隆表单和另一行,此图像已被克隆4次。

如果我单击 - 按钮中的任何一个,它将删除该行,到目前为止这是完美的。

问题出现在你点击 - 按钮时,它应该只删除那一行,但它也会删除文本框中的所有值但由于某种原因我的图像输入框保持正常?

这里是jquery

function pp_updateClonedInput(index, element,param) {
    $(element).appendTo("#upload_pp_sets").attr("id", "ppclonedInput" +  index);
    $(element).find(">:first-child").attr("id", "cs_product_menu_pp_src_" + index);
    $(element).find(">:first-child").attr("name", "hero_options[upload_pp_link_" + index + "]");
    $(element).find(">:nth-child(4)").attr("id", "pp_text_box" + index);
    $(element).find(">:nth-child(4)").attr("name", "hero_options[pp_text_box_" + index + "]");
    if(param)
        $(element).find(">:first-child").attr("value", "");
        $(element).find(">:nth-child(4)").attr("value", "");
        $(element).find(">:first-child").next().attr("id", "cs_product_menu_pp_src_" + index + "_ppbutton");
    }



$(document).on("click", ".ppclone", function(e){
    e.preventDefault();
    var pptoappend='<div id="ppclonedInput1" class="ppclonedInput"><input id="cs_product_menu_pp_src_1" type="text" size="36" name="hero_options[upload_pp_link_1]" value="" /><input id="cs_product_menu_pp_src_1_ppbutton" type="button" value="Add / Change" class="button-secondary pp-upload-button" /><div class="button ppremove">-</div> <input id="pp_text_box1" class="pp_text_box" type="text" size="15" name="hero_options[pp_text_box_1]" value="" /> <span class="description">Slide Show Text</span>'
    if( $(".ppclonedInput").length < 1){
        // create div
        $('#upload_pp_sets').append(pptoappend);
    }
    else {
        // clone div
        var ppcloneIndex = $(".ppclonedInput").length + 1;
        var ppnew_Input = $(this).closest('.ppclonedInput').length ? $(this).closest('.ppclonedInput').clone() : $(".ppclonedInput:last").clone();
        pp_updateClonedInput(ppcloneIndex, ppnew_Input,true); 
    }   
});

$(document).on("click", ".ppremove", function(e){
    e.preventDefault();
    $(this).parents(".ppclonedInput").remove();
    $(".ppclonedInput").each( function (ppcloneIndex, ppclonedElement) {
        pp_updateClonedInput(ppcloneIndex + 1, ppclonedElement,false);
    })
});

如果我删除该行

$(element).find(">:nth-child(4)").attr("value", "");

它工作正常,但当您点击“添加图片”时按钮,文本框将显示以前的值内容,通过添加该行,它会给我一个空白表单。

我无法弄清楚为什么图像输入工作完美,但文字框没有,任何人都可以帮忙吗?

如果您需要更多信息,请与我们联系。

1 个答案:

答案 0 :(得分:1)

以下代码是否在{}?

之间
if(param)
    $(element).find(">:first-child").attr("value", "");
    $(element).find(">:nth-child(4)").attr("value", "");
    $(element).find(">:first-child").next().attr("id", "cs_product_menu_pp_src_" + index + "_ppbutton");

我的意思是,像这样:

if(param) {
    $(element).find(">:first-child").attr("value", "");
    $(element).find(">:nth-child(4)").attr("value", "");
    $(element).find(">:first-child").next().attr("id", "cs_product_menu_pp_src_" + index + "_ppbutton");
}