如何通過jquery得到父類型

-5

如果用戶點擊一個按鈕（類爲按鈕），那麼通過jquery知道父元素的類型有什麼方法？讓我們看一下佈局：如何通過jquery得到父類型

<table> 
<tr><td>Menu</td></tr> 
<tr><td>Submenu of the page</td><td> 
<form action=""> 
    <input type="text" name="fullname" value="" /> 
    <input type="password" name="password" value="" /> 
    <input type="submit" class="button" value="Submit" /> 
</form> 

<table> 
    <thead><tr><th>Name</th><th>Password</th><th>Action</th></tr></thead> 
    <tbody> 
      <tr><td>Mr.X</td><td>1234</td><td><input type="button" class="button" value="check" /></td></tr> 
      <tr><td>Mr.Y</td><td>1234</td><td><input type="button" class="button" value="check" /></td></tr> 
      <tr><td>Mr.Z</td><td>4567</td><td><input type="button" class="button" value="check" /></td></tr> 
    </tbody> 
</table> 
<div> 
this is some text and the below button check whether it is div<br /> 
<input type="button" class="button" value="check" /> 
</div> 
</td> 
</tr> 
</table>

現在，如果用戶點擊無論是在形式的Submit按鈕或表check按鈕，jQuery代碼必須確定父是否是形式或表或不管它是什麼。我必須根據父類型採取一些操作（例如：如果type是表單然後是serializeArray（），或者如果表單類型是表，那麼在獲取回調數據後，tr將被更新..等等）。這裏parent' does not mean the immediate parent of the DOM, rather it means the highest part of the .button`類。

我怎樣才能得到父母是形式或表或div等？

來源

2015-08-30 Abdullah Mamun-Ur- Rashid

在點擊事件，'$（本）.parent（）丙（ '節點名稱'）' –

爲什麼不要在按鈕上放置不同的類，並相應地分配不同的點擊事件處理程序？ –

不，它不工作。它正在返回'td'，因爲表格或表格是另一個表格'td'的一部分。我已經更新了佈局。 Plz審查佈局。 –

-1

您可以使用$(this).parent().prop("tagName")來獲取標籤名稱。我爲此創建了fiddle。請檢查。

來源

2015-08-30 04:19:33 hardikvd

不，它不工作。它正在返回'td'，因爲表格或表格是另一個表格'td'的一部分。我已經更新了佈局。 Plz審查佈局。 –

-1

使用closest()：

$('.button').on('click', function() { 
    if ($(this).closest('form').length) { /* it's inside a <form> block */ } 
    else { /* it's not inside a <form> block */ } 
});

這（加上當前的DOM）是設計容易壞但是。我會做這樣的事情，而不是：

<table> 
    <tr><td>Menu</td></tr> 
    <tr><td>Submenu of the page</td><td> 
     <form action=""> 
      <input type="text" name="fullname" value="" /> 
      <input type="password" name="password" value="" /> 
      <input type="submit" class="button" data-button-type="form" value="Submit" /> 
     </form> 
     <table> 
      <thead><tr><th>Name</th><th>Password</th><th>Action</th></tr></thead> 
      <tbody> 
       <tr><td>Mr.X</td><td>1234</td><td><input type="button" class="button" data-button-type="table" value="check" /></td></tr> 
       <tr><td>Mr.Y</td><td>1234</td><td><input type="button" class="button" data-button-type="table" value="check" /></td></tr> 
       <tr><td>Mr.Z</td><td>4567</td><td><input type="button" class="button" data-button-type="table" value="check" /></td></tr> 
      </tbody> 
     </table> 
    </td></tr> 
</table>

你的JS是：

$('.button[data-button-type]').on('click', function() { 
    var buttonType = $(this).attr('data-button-type'); 
    if (buttonType === 'form') { /* Handle form buttons */ } 
    else if (buttonType === 'table') { /* Handle table buttons */ } 
    else if (buttonType === 'div') { /* Handle div buttons */ } 
});

來源

2015-08-30 04:23:01 Derek

爲什麼downvote？這正是在OP – Derek

中提出的問題，不是，我不想將它的範圍限制在表格或表格中，也可能是段落或div。所以這個類型應該是動態的。它應該返回類型的標籤名稱。 –

@ AbdullahMamun-Ur-Rashid _「我不會將它的範圍限制在表格或表格中，它可能是一個段落或div，所以這個類型應該是動態的。它應該返回類型的標籤名稱。「_可以在這個問題中包含這個細節？ – guest271314

你的聲明「在這裏父[...]表示.button類的最高部分」目前還不清楚。我猜你是指頂部<table>元素的<td>元素中的最高祖先元素。我們稱之爲「容器」元素。目前，您可以用得到這個元素：

var $container = $('body>table>tbody>tr:last>td:last');

（注：這將是一個容易得多，如果這對id或在其上的class）

現在，你可以得到的類型「家長」通過使用點擊的按鈕元素：

$(".button").click(function() { 
    var parentType = $(this).parentsUntil($container).last().prop('nodeName'); 
    alert(parentType); 
});

jsfiddle

來源

2015-08-30 05:32:22

如何通過jquery得到父類型

回答

相關問題