Question

我有多个.note，我希望能够点击.remove（每个.note中），它会删除.note .remove .closest()我点击的是1}}。我已经使用.note来执行此操作，但它只适用于第一个注释，而不适用于其他注释。提前谢谢！

以下是代码：

删除$('.remove').click(function () { $(this).closest('.note').remove(".note"); });的代码：

<body>
<div id="wrapper">
    <div id="wrp">
         <h1>Click to make a new note!!!</h1>

        <hr>
        <div class="note">
            <p class="remove"><b>X</b>

            </p>
            <div class="time"></div>
            <hr>
            <textarea class="item"></textarea>
            <div class="saved"><span class="msg"></span>

            </div>
        </div>
</body>

HTML：

$('.note').click(function (event) {
event.preventDefault();
});

$('#wrp, #wrapper').click(function showNote() {
$('.note').fadeIn();
});

$(function () {

$(document).mousedown(function (event) {
    // only proceed if clcik is not anywhere in a note element
    if (!$(event.target).closest('.note').length) {
        var note2 = $('.note').first();
        note2.clone().insertBefore(note2);
        console.log(note2);
    }
});
});

$('.remove').click(function () {
$(this).closest('.note').remove(".note");
});



window.onload = function () {
var input = $("#item").focus();
};



function date() { //code indentation
var now = new Date();
now2 = now.getMonth() + 1 + '/' + now.getDate() + '/' + now.getFullYear() + ' ' + now.getHours() + ':' + now.getMinutes() + ':' + now.getSeconds();
$('.time').html(now2);
}
date();

var autosaveOn = false;

function myAutosavedTextbox_onTextChanged() {
if (!autosaveOn) {
    autosaveOn = true;
    $('.item').everyTime("3000", function () {
        $.ajax({
            type: "POST",
            url: "/echo/html/",
            data: "id=1",
            success: function (msg) {
                $('.msg').text(Saved);
                alert("saved");
            }
        });
    }); //closing tag
}
}
$(".note").closest('.note').draggable();

$(function () {
$("#tabs").autoSave(callback, ms);
});
$(".item").autoSave(function () {
var time = new Date().getTime();
$("#msg").text("Draft Autosaved " + time);
}, 500);

JS：

<Elements>
  <ChildElement1> 
      <GrandChildEle1/>
      <GrandChildEle2/>
      <GrandChildEle3/>
      <GrandChildEle4/>
  </ChildElement1>
  <ChildElement2> 
      <GrandChildEle5/>
      <GrandChildEle6/>
      <GrandChildEle7/>
  </ChildElement2>
</Elements>

Answer 1

看起来你有一个音符，然后当你点击音符以外的东西然后将它插入前一个音符旁边时，你就会克隆它。由于您只绑定了第一个音符，因此需要使用实时功能。例如。

之类的东西

＆＃13;

 $('body').on('click', '.remove', function() {
   $(this).closest('.note').remove(); 
 });

＆＃13;

Answer 2

因为您知道@javax.persistence.Version元素是.remove的直接子元素，所以您只需选择其父元素：

.note

如果$('.remove').click(function () { $(this).parent().remove(); });元素不是.remove的直接子元素，则可以执行此操作：

.note

重要：

如果您的笔记是动态生成的，那么您需要利用事件委派，将点击处理程序附加到包装器而不是$('.remove').click(function () { $(this).parents(".note").remove(); });按钮，并在单击类.remove的元素时触发在包装器中：

.remove

Answer 3

这样做：

$('.remove').click(function () {
    $(this).closest('.note').remove();
});

这将只删除closest注释，因为closest()函数已经选择了元素。如果将参数传递给remove()，它将搜索与其匹配的所有元素，但如果您在已选择的节点上使用它，则会删除该节点。

DOCS：https://api.jquery.com/remove/

Answer 4

这是一个可能的解决方案。可能我迟到了......在输入答案时心烦意乱。

＆＃13;

$('.remove').on('click', function(){
  $(this).parent().remove();
  });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<div id="wrapper">
    <div id="wrp">
         <h1>Click to make a new note!!!</h1>

        <hr>
        <div class="note">
            <p class="remove"><b>X</b>

            </p>
            <div class="time"></div>
            <hr>
            <textarea class="item">Note1</textarea>
            <div class="saved">
              <span class="msg"></span>
            </div>
        </div>
      <div class="note">
            <p class="remove"><b>X</b>

            </p>
            <div class="time"></div>
            <hr>
            <textarea class="item">Note2</textarea>
            <div class="saved">
              <span class="msg"></span>
            </div>
        </div>
      <div class="note">
            <p class="remove"><b>X</b>

            </p>
            <div class="time"></div>
            <hr>
            <textarea class="item">Note3</textarea>
            <div class="saved">
              <span class="msg"></span>
            </div>
        </div>
      <div class="note">
            <p class="remove"><b>X</b>

            </p>
            <div class="time"></div>
            <hr>
            <textarea class="item">Note4</textarea>
            <div class="saved">
              <span class="msg"></span>
            </div>
        </div>
      <div class="note">
            <p class="remove"><b>X</b>

            </p>
            <div class="time"></div>
            <hr>
            <textarea class="item">Note5</textarea>
            <div class="saved">
              <span class="msg"></span>
            </div>
        </div>
      </div>
  </div>
</body>

＆＃13;

如何从具有大量元素的类中删除一个元素？

4 个答案: