3

我希望用户能够双击屏幕上的任意位置以显示允许提交有关该地点的反馈的表单。

我可以想到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 时,将显示反馈表单(为简单起见,我的示例中不包含传递被双击项目 ID 的代码)。

所以 2 并不完美,但它似乎可以解决对受支持的 html 实体列表的任何反馈。

我忽略了一些更简单的解决方案吗?

另外,如果我选择 2,双击是参与此反馈表的最佳方法,还是您会推荐其他活动?

4

6 回答 6

2

您应该能够编写/获取一个命中测试函数,以查看双击鼠标光标时的 DOM 元素,然后将评论/反馈文本与所选元素的 ID 相关联

这假设您的所有 DOM 元素都有唯一的 ID

(并且您的用户知道他们可以做到这一点!)

于 2009-01-14T02:16:24.833 回答
2

我建议不要在网站上设置任何可评论的位置,而是允许对特定元素进行评论。例如,如果它是一个博客,您可以将每个段落用作可以评论的元素。如果它是代码存储库,则可以将注释添加到单独的代码行中。

看看The Django Book 是如何评论段落的

于 2009-01-14T02:25:54.737 回答
1

我希望你的大部分布局都使用 <div> 和 <table> 标签。正如 Steven 建议的那样,为每个块元素或作为网页不可或缺的一部分的任何其他元素(可能是图像)关联唯一的 id。

有一个与块/布局元素关联的 onclick 事件以打开另一个窗口或 javascript 弹出窗口,捕获元素 id 并在弹出窗口中有一个表单,用户可以在其中提交他们的反馈。

我还建议一个 onmouseover 甚至与所有这些元素相关联,并显示一个工具提示,指示用户可以留下有关该布局小部件/元素的反馈。

于 2009-01-14T02:49:50.850 回答
0

你可以这样做:

您想要评论的块有一个“可评论”类并有一个 id。
下面的脚本是适用于 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 );
于 2009-01-14T09:46:34.427 回答
0

我有点喜欢第二种解决方案,但我不会将该函数附加到某些 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 文档

于 2009-01-15T11:31:38.550 回答
0

双击不好,因为在大多数浏览器中,您可以通过双击来选择单词。

相反,页面上应该有一些特殊的地方,您可以单击以提供反馈。请参阅 Soviut 的答案以获取一个很好的示例。

于 2009-01-14T07:51:42.410 回答