使用变量使用jQuery添加和删除表单输入字段

时间:2012-05-07 23:02:53

标签: javascript jquery

我想在单击带有class =“checkbox”的范围时向表单添加隐藏的输入字段,并在单击带有复选标记的span时删除该字段。

我可以添加输入,但我无法将其删除

我的HTML:

<span title="Here's My Title" class="wishlistcheck checkbox">1</span>

<form id="wishlistform"></form>

我的Javascript:

$(document).ready(function() {

    var appNum = 0;

    $("span.wishlistcheck").click(function() {
        var el = $(this);
        var appName = el.attr("title");

        var isChecked = el.hasClass('checkmark');
        if(!isChecked) {
            el.removeClass('checkbox');
            el.addClass('checkmark');

            appNum++

            $("#wishlistform").append("<input id=\"" + appName + "\" type=\"hidden\" name=\"product_" + appNum + "\" value=\"" + appName + "\">");


        } else {
            el.removeClass('checkmark');
            el.addClass('checkbox');

            appNum--

            $("input#" + appName).remove();




        }
    });
});

2 个答案:

答案 0 :(得分:2)

我猜你必须在调用.remove()方法之后放置appNum--。试试吧:

$(document).ready(function() {
    var appNum = 0;
    $("span.wishlistcheck").click(function() {
        var el = $(this);
        var appName = el.attr("title");
        var isChecked = el.hasClass('checkmark');
        if(!isChecked) {
            el.removeClass('checkbox');
            el.addClass('checkmark');
            appNum++
            $("#wishlistform").append("<input class=\"" + appName + "\" type=\"hidden\" name=\"product_" + appNum + "\" value=\"" + appName + "\">");
        } else {
            el.removeClass('checkmark');
            el.addClass('checkbox');
            appNum--
            $("input[class=" + appName + "]").remove();
        }
    });
});

答案 1 :(得分:2)

你可能有那个id标签有多个DOM元素,所以它可能正在删除一个匹配该id而不是正确的元素。

尝试给它一个类名,并通过添加父元素在jQuery参数中更具体,即

 $('#wishlistform input#' + appName).remove();