Передача параметра из элемента html с помощью jQuery

Чтобы перейти от диапазона к окружающим div, вы можете использовать <tt>parent()</tt> (если вы знаете точное соотношение), например: <tt>$(this).parent().attr('id')</tt>;, или, если структура может быть более глубоко вложенной, вы можете использовать parent () для поиска по дереву DOM. , вот так: <tt>$(this).parents('div:eq(0)').attr('id')</tt>.

Чтобы не усложнять свой ответ, я перестал сопоставлять класс <tt>"comment"</tt>, но, конечно, вы могли бы это сделать, если это поможет сузить область поиска, которую вы ищете.

У вас нет большого контроля над аргументами, передаваемыми в обработчик связанных событий.

Возможно, попробуйте что-то вроде этого для своего определения сделай что-нибудь():

function doSomething() { 
  var commentId = $(this).parent().attr('id');
  alert(commentId); 
}

Обратные вызовы событий вызываются с объектом события в качестве первого аргумента, вы не можете передать что-то еще таким образом. Этот объект события имеет свойство target, которое ссылается на элемент, для которого он был вызван, а переменная this является ссылкой на элемент, к которому был прикреплен обработчик события. Итак, вы могли сделать следующее:

function doSomething(event)
{
    var id = $(event.target).parents(".tools").attr("id");
    id = substring(id.indexOf("-")+1);
    alert(id);
}

...или же:

function doSomething(event)
{
    var id = $(this).parents(".tools").attr("id");
    id = substring(id.indexOf("-")+1);
    alert(id);
}

Возможно, будет проще пролистать комментарии и добавить к каждому инструмент. Таким образом, вы можете дать каждому из них свою функцию. У меня есть функция, возвращающая функцию, поэтому, когда она вызывается позже, ей доступен правильный идентификатор комментария.

Другие решения (которые возвращаются вверх, чтобы найти идентификатор родителя), вероятно, будут более эффективными с точки зрения памяти.

<script type='text/javascript'>

$(function() {
  $('.comment').each(function(comment) {
    $('.tools', comment).append(
      $('<span>[Do Something]</span>')
          .click(commentTool(comment.id));
    );
  });
});

function commentTool(commentId) {
  return function() {
    alert('Do cool stuff to ' + commentId);
  }
}

</script>

Придумайте немного фантазии, чтобы дать вам представление о некоторых вещах, которые вы можете сделать:

var tool = $('<span>[Tool]</span>');

var action = function (id) {
    return function () {
        alert('id');
    }
}

$('div.comment').each(function () {
    var id = $(this).attr('id');

    var child = tool.clone();
    child.click(action(id));

    $('.tools', this).append(child);
});

Функция bind () принимает элемент в качестве параметра (в вашем случае - span), поэтому, чтобы получить от него идентификатор, который вы хотите, вы должны выполнить некоторый обход DOM, например:

function doSomething(eventObject) { 
    var elComment = eventObject.parentNode.parentNode; //or something like that, 
                                                       //didn't test it
    var commentId= elComment.getAttribute('commentId')
    alert(commentId); 
}