沒有定義元素的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（）

回答

相關問題