Question

我希望我的代码能够像这样工作：很少有具有类似ID和类似内容的DIV。当我点击CLICK按钮时，我需要已经存在DIV id =“object”来预先添加到单击按钮的父div。我的代码只适用于第一个DIV。

HTML

<div id="article">
<p>...CONTENT</p>
<div class="click">CLICK</div>
</div>

<div id="article">
<p>...CONTENT</p>
<div class="click">CLICK</div>
</div>

CSS

#article{
    width: 100%;
    height: 200px;
    background: gray;
    color: white;
}

.click{
    cursor: pointer;
    color: red;
}

#object{
    width: 100%;
    height: 100px;
    background: red;
}

Jquery的

$(".click").click(function(){
    $('#object').prependTo("#article");
});

JSFiddle

Answer 1

好的，首先，对多个元素使用相同的ID是坏的，坏的，坏的。见Why is it a bad thing to have multiple HTML elements with the same id attribute?。您可以使用类

<div class="article">
<p>...CONTENT</p>
<div class="click">CLICK</div>
</div>

<div class="article">
<p>...CONTENT</p>
<div class="click">CLICK</div>
</div>

要预先添加到最近的div，您可以将jQuery closest()与$(this)一起使用，这将是＆＃39;点击＆＃39; div进入处理程序时的div

$(this).closest('.article').prepend($('#object'));

看到它正常工作here

将一些对象添加到父级，父级是具有类似ID的DIV之一

1 个答案: