没有定义元素的jQuery $（元素）一个.remove（）

我有这个JavaScript，增加了一个表单域的链接一起删除字段：

var fieldCount = 0; 
function addField() { 
    var name = 'file' + fieldCount; 
    var row = 'row' + fieldCount; 
    var str = '<p id="' + row + '"><label for="' + name + '">File to upload: <input type="file" name="' + name + '" id="' + name + '" />(100MB max size) <a onclick="removeRow(' + row + '); return false;">[-]</a></label></p>'; 
    fieldCount++; 
    $("#fields").append(str); 
}; 
function removeRow(id) { 
    $(id).remove(); 
};

下面是标记：

<form id="ajaxUploadForm" action="<%= Url.Action("AjaxUpload", "Upload")%>" method="post" enctype="multipart/form-data"> 
    <fieldset id="uploadFields"> 
     <legend>Upload a file</legend> 
     <div id="fields"></div> 
     <input id="ajaxUploadButton" type="submit" value="Submit" />    
    </fieldset> 
    <a onclick="addField(); return false;" id="add">Add</a> 
    <div id="resultBox"> 
     <p id="status" style="margin:10px;"></p> 
    </div> 
</form>

addFields按预期工作，但是当我单击删除链接时，萤火虫告诉我没有定义“row＃”，其中＃是任何数目的添加字段。

任何帮助，将不胜感激！

来源

2009-09-23 Anders

我改变了我的示例以显示锚标记。 – cgp 2009-09-23 19:46:35

你需要通过一个有效的选择表达了一个ID选择器（#ID），无论是在removeRow调用（也注意ID选择周围的引号）：

'<a onclick="removeRow(\'#' + row + '\'); return false;">'

还是在removeRow函数本身：

function removeRow(id) { 
    $("#" + id).remove(); 
};

来源

2009-09-23 14:38:08 Gumbo

至少我用自己的答案走在了正确的轨道上 - 只是没有及时输入。 :) – Mayo 2009-09-23 14:40:43

啊，我肯定忘了＃。谢谢！ – Anders 2009-09-23 14:42:15

因为它是一个字符串，所以你需要引号。您还需要“＃”，使之成为一个选择：

var str = '... <a onclick="removeRow(\'#' + row + '\'); return false;">...';

一个更好的办法是的onclick指定为一个功能（不知道的jQuery的方式来做到这一点，但在普通的JavaScript）：

var a = document.createElement('a'); 
a.onclick = (function(row) 
{ 
    return function() 
    { 
     removeRow(row); 
     return false; 
    }; 
})();

来源

2009-09-23 14:37:28 Greg

我喜欢这个回应，因为它似乎更好地坚持不引人注目的JavaScript精神。尽管这两种解决方案都是在静态HTML之外编写的，但操作系统解决方案使用内联JavaScript呈现HTML，而您的解决方案与HTML完全分离。 – Mayo 2009-09-23 14:46:59

你传递的 “row12” 的字符串值，但选择应该是：

$('#'+row').remove()

的＃指定你寻找身份证。我同意，我认为其他的答案之一刚想说什么，你应该使用的onclick事件自然‘这个’关键字，而不是：

<p onclick="remove(this)">something</p> 

function remove(what) { 
$(what).remove() 
}

或者，也许只是忘记了整个事情都在一起，切换到行为的各种行：

$('.removableRow').live('click', function() {$(this).remove()});

然后你只需指定该行是可移动的，并且永远不必担心事件绑定都：

<p><a class="removableRow" href="#">Remove</a></p>

来源

2009-09-23 14:39:30 cgp

不幸的是，如果我点击浏览...按钮，它将删除该行。有没有办法只接受来自锚标签的点击？ – Anders 2009-09-23 14:56:58

当然，我改变它来显示你所要求的。 – cgp 2009-09-23 19:46:05

没有定义元素的jQuery $（元素）一个.remove（）

回答

相关问题