Как я могу сохранить отзывы пользователей, относящиеся к любой части веб-страницы?

вы должны иметь возможность написать / получить функцию проверки попадания, чтобы увидеть, какие элементы DOM находятся под курсором мыши при двойном щелчке, а затем связать текст комментариев / обратной связи с идентификатором выбранного элемента

это предполагает, что все ваши элементы DOM имеют уникальные идентификаторы

(и что ваши пользователи знают, что они могут это сделать!)

Я бы рекомендовал не комментировать место любой на сайте, а вместо этого разрешить комментировать определенные элементы. Например, если это блог, вы можете использовать каждый абзац как элемент, который можно комментировать. Если это репозиторий кода, тогда комментарии могут быть добавлены к отдельным строкам кода.

Посмотрите, как В Django Book комментируют абзацы..

Я надеюсь, что большая часть вашего макета использует теги <div> и <table>. Как предложил Стивен, имейте уникальный идентификатор, связанный с каждым из ваших блочных элементов или любыми другими элементами, которые являются неотъемлемой частью вашей веб-страницы (возможно, изображениями).

Имейте событие onclick, связанное с элементом блока / макета, чтобы открыть другое окно или всплывающее окно javascript, захватить идентификатор элемента и иметь форму во всплывающем окне, где пользователь может отправить свой отзыв.

Я бы также предложил onmouseover, даже связанный со всеми этими элементами, который отображает всплывающую подсказку, указывающую, что пользователь может оставить отзыв об этом виджете / элементе макета.

Двойной щелчок - это плохо, потому что в большинстве браузеров вы можете выбирать слова, дважды щелкая по ним.

Вместо этого на странице должны быть специальные места, по которым вы можете щелкнуть, чтобы оставить отзыв. См. Хороший пример в ответе Soviut.

Вы можете сделать что-то вроде этого:

Блоки, которые вы хотите прокомментировать, имеют класс commentable и идентификатор. Приведенный ниже сценарий представляет собой схему, которая работает для браузеров, совместимых с W3C, т.е. для этого потребуется использовать attachEvent и глобальный объект события. Распространение события не отменяется, поэтому комментируемые блоки внутри комментируемых блоков будут запускать событие один раз. Действие по умолчанию для события также не отменяется, поэтому текст, на который дважды щелкнули, все равно будет выделен - возможно, в вашем диалоговом окне может быть действие «щелкните escape, чтобы отменить»?

function CommentDialog() {
    //this is a fake CommentDialog object constructor
    this.display = function( id ) {
        alert( 'you want to comment on the block with id: '+id+', which is outlined in red' );
    } 
}



window.addEventListener( 'dblclick', function(e){ 
    var target = e.target;
    while( /commentable/.test( target.className ) == false ) {
        // if we've hit the body tag then bomb out
        if ( target == document.body ) {
            return;
        }
        target = target.parentNode;
    }
    target.style.border = '1px solid red';
    var cmt = new CommentDialog();
    cmt.display( target.id );
 }, false );

Мне нравится второе решение, но я бы прикрепил функцию не к некоторым объектам html, а к четко определенному div что-то вроде:

$(document).ready(function() {
    $("div .commentable").each().bind("dblclick", function(e) {
        $("#feedback_form").show();
});
});

Итак, вам просто нужно обернуть все элементы, которые вы хотите комментировать, в <div class = "commentable"> .. </div>.

В первом решении, если вам нужна обратная связь в каждом месте вашей страницы, а не только в определенных элементах, JQuery может вам помочь.

jQuery(document).ready(function(){
   $().click(function(e){
      alert(e.pageX +', '+ e.pageY);
   }); 
})

См. Документ JQuery для получения дополнительной информации.