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

Question

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

Я могу представить 2 решения:

1. Хранить координаты X, Y. Должен был исключить это, так как координаты X, Y поддерживаются не во всех браузерах.

2. Используйте Jquery для привязки исчерпывающего списка html-сущностей к событию dblClick, например:

   $(document).ready(function() {
   $("p,label,input,textarea").bind("dblclick", function(e) {
       $("#feedback_form").show();
   });
   

   });

Таким образом, в приведенном выше примере, если дважды щелкнуть любой p, label, input или textarea, будет отображена форма обратной связи (код для передачи идентификатора элемента, по которому дважды щелкнули, для простоты не включен в мой пример ).

Таким образом, 2 не является идеальным, но, похоже, оно поможет при любом отзыве в списке поддерживаемых html-сущностей.

Есть ли какое-то более простое решение, которое я пропускаю?

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

Answer 1

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

Посмотрите, как Книга Джанго комментирует пункты .

Answer 2

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

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

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

Answer 3

Я надеюсь, что большая часть вашего макета использует теги

и

Answer 4

Мне нравится второе решение, но я бы прикрепил функцию не к некоторым 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 doc .

Answer 5

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

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

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 );

Answer 6

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

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