0

我正在尝试在 jquery 中制作一个简单的用户点击动作记录器，但遇到了一些麻烦。我希望用户单击记录按钮，然后单击记录他单击的内容。然后按停止按钮停止录制。到目前为止，我所拥有的是：

var stack = new Array();
var recordmode = false;

$('#record').click(function(){
recordmode = true;
alert('You are now in record mode');
});

$('#stop').click(function(){
recordmode = false;
console.log(stack);//output what's in the array
stack = []; //erase the array
});


$('#note_markers').click(function(){
if(recordmode){
$('.one_0').click( function(){ stack.push('one_0'); })
$('.one_1').click( function(){ stack.push('one_1') ; })
}
});

以及后来的开始和停止按钮。

<a id='record'>R</a>
<a id='stop'>stop</a>
                           <div id="one_notes">
                                <a class="one_0"></a>
                                <a class="one_1"></a>
                                <a class="one_2"></a>
                                <a class="one_3"></a>
</div>

同样在停止和擦除阵列之前..我想以 /one_0/one_1/one_0 等形式构建一个 URL，其中记录了阵列中的内容。（虽然还没有到那部分）

发生的情况是没有记录第一次点击，然后它开始放入两个相同的元素。我不知道为什么我会得到当前的行为。

有任何想法吗？

作为旁注，有没有办法获得任何点击元素的名称？

4

2 回答 2

1

您可能想尝试为要跟踪的每个操作分离点击处理程序。

$('.one_0').click( function(){ 
    if(recordmode){
      stack.push('one_0'); 
    }
});

$('.one_1').click( function(){ 
    if(recordmode){
      stack.push('one_1'); 
    }
});

这看起来像很多重复的代码......让我们试着清理一下。为什么不更进一步，给你所有的“可记录”动作赋予一个rel可能具有独特属性的同一个类......

使用更新的 1.7+ jQuery 语法。

<a class="recordable" rel="one_1"></a>
<a class="recordable" rel="one_2"></a>

$('.recordable').on('click', function(){ 
    if(recordmode){
      stack.push($(this).attr('rel'); 
    }
});

至于从生成的操作数组构建 URL，您可以使用 JavaScriptjoin()函数。

var targetURL = _base_url + stack.join('/');

您可以使用上面评论中提到的方法捕获对任何元素的点击...但是我建议您准确标记要捕获的操作，而无需捕获所有内容...

于 2012-04-25T21:17:51.117 回答
1

你的问题是当它冒泡时你得到点击#note_markers和点击。.one_1

尝试这个：

$('#note_markers a').click(function(){
    if(recordmode)
        stack.push($(this).attr('class'));
});

您可以更改事件侦听器以侦听您实际需要的任何内容，但这将根据提供的 html 执行您想要的操作

于 2012-04-25T21:35:07.197 回答