家長不要在jQuery的

Question

工作

HTML：

<div id="comentario-info"> 
    <b>AngelRmz</b> hace 8 minutos 
    <div id="comentario-botones" data-id="1"> 
    <div id="comentario-boton" class="comentario-informar" title="Informar"></div> 
    <div id="comentario-boton" class="comentario-eliminar" title="Eliminar"></div> 
    <div id="comentario-boton" class="comentario-editar" title="Editar"></div> 
    <div id="comentario-boton" class="comentario-guardar" title="Guardar"></div> 
    </div> 

的JavaScript：

comentarioId = $(this).parents().parent('#comentario-botones').attr("data-id"); 
alert(comentarioId); // return 1 

Answer 1

你不需要parent()當你已經使用.parents()，

parents()會給你所有的父母元素U可以簡單的通過其ID，類或的Attr，

ID也必須是唯一的。

如果你不想讓ID唯一併且仍然想使用ID選擇器，那麼我有簡單的解決方案。

你的ID選擇必須是這樣的$('[id="your-ID"]')

$('[id="comentario-boton"]').click(function(){ 
 
    comentarioId = $(this).parents('#comentario-botones').attr("data-id"); 
 
    alert(comentarioId); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div id="comentario-info"> 
 
<b>AngelRmz</b> hace 8 minutos 
 
<div id="comentario-botones" data-id="1"> 
 
    <div id="comentario-boton" class="comentario-informar" title="Informar">Informar</div> 
 
    <div id="comentario-boton" class="comentario-eliminar" title="Eliminar">Eliminar</div> 
 
    <div id="comentario-boton" class="comentario-editar" title="Editar">Editar</div> 
 
    <div id="comentario-boton" class="comentario-guardar" title="Guardar">Guardar</div> 
 
</div>

注：這是不是一個好的做法，但是這是誰想要使用相同的ID是有原因的開發簡單的黑客。

Answer 2

ID必須是唯一的。您使用data-id。所以取值爲data。

$("#comentario-botones").on("click", "div", function() { 
 
    var comentarioId = $(this).parent().data('id');; 
 
    alert(comentarioId); // return 1 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="comentario-info"> 
 
    <b>AngelRmz</b> hace 8 minutos 
 
    <div id="comentario-botones" data-id="1"> 
 
    <div id="comentario-boton1" class="comentario-informar" title="Informar">1</div> 
 
    <div id="comentario-boton2" class="comentario-eliminar" title="Eliminar">2</div> 
 
    <div id="comentario-boton3" class="comentario-editar" title="Editar">3</div> 
 
    <div id="comentario-boton4" class="comentario-guardar" title="Guardar">4</div> 
 
    </div>