jQuery .parents([selector]) doesn't work with IE9 and Firefox
Question
<html>
<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="application/javascript">
$(document).ready(function() {
$("#evaluation_complete").parents("table")[0].remove(); //doesn't work
//this works
//var EvalComplete = document.getElementById("evaluation_complete");
//EvalComplete.parentNode.parentNode.parentNode.parentNode.parentNode.removeChild(
//EvalComplete.parentNode.parentNode.parentNode.parentNode);
});
</script>
<p>Testing little code</p>
<table>
<tbody>
<tr>
<td class="button-left"> </td>
<td class="button-middle" nowrap="true"><div
style="margin: 0px 0px 1px;">
<a class="button-text" name="evaluation_complete"
id="evaluation_complete" href="#">Evaluation Complete</a>
</div></td>
<td class="button-right"> </td>
</tr>
</tbody>
</table>
</body>
</html>
I have no control of how the table is set up. However all I know is the id of the link. My goal is to traverse to the <table> element and remove it from DOM. I've also tried it with closest . The error I get in Firefox and IE9 is that remove is not a function. The commented out block works but is not very dynamic. However, in Chrome, it works flawlessly. Thank you for any help.
1 answers
solution1
7 ACCPTED 2013-03-04 20:33:01
It does'nt work as you are trying to use .remove() on a native JS element, not a jQuery element:
It's not :
$("#evaluation_complete").parents("table")[0].remove();
but
$("#evaluation_complete").parents("table").eq(0).remove();
or
$("#evaluation_complete").parents("table").first().remove();
etc.
using [0] or get(0) gets the native JS element from the array-like jQuery object, which does'nt have a .remove() method.
As a sidenote, using closest() would be more efficient, and will work with the above examples.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.