如何在Javascript函数中停止执行单击事件?
-
08-07-2019 - |
题
我正在尝试将onclick事件分配给当我点击另一个元素时已存在的锚标记。但是,我尝试的所有内容似乎都会导致在分配后立即触发事件。我们正在使用Prototype和Scriptaculous。
这是功能:
<script type="text/javascript">
function loadData(step, dao_id) {
var div_id = 'div_' + step;
var anchor_id = 'step_anchor_' + step;
var prv = step -1;
switch(step) {
case 1:
var action = 'major_list';
break;
case 2:
var action = 'alumni_list';
break;
case 3:
var action = 'alumnus_display';
break;
}
new Ajax.Request('awizard.php', {
method: 'get',
parameters: {action : action, dao_id : dao_id},
onSuccess: function(data) {
$(div_id).innerHTML = data.responseText;
//$(anchor_id).observe('click', loadData(prv, dao_id, true));
//Event.observe(anchor_id, 'click', alert('I executed'));
showStep(step);
//$(anchor_id).onclick = loadData(prv, dao_id, true);
//$(anchor_id).observe('click', loadData(prv, dao_id, true));
}
}
)
}
function showStep(step, toggleBack) {
var div_id = 'div_' + step;
if(!toggleBack) {
if(step != 1) {
var prv = step -1;
Effect.SlideUp('div_' + prv, { duration:1, delay:0 });
}
Effect.SlideDown(div_id, { duration:1, delay:1 });
Effect.Appear('step_anchor_' + step, { duration:1, delay:2 });
} else {
var prv = step -1;
Effect.SlideDown('div_' + prv, { duration:1, delay:0 });
Effect.SlideUp(div_id, { duration:1, delay:1 });
Effect.Fade('step_anchor_' + step, { duration:1, delay:2 });
}
}
</script>
正如您所知,我已经尝试了多种方法将onclick事件分配给锚标记,但没有一种方法可以正常工作。起初我假设锚标签上的Effect.Appear函数可以触发onclick事件,所以我尝试将事件赋值移动到showStep函数之后但没有任何区别。另外,我尝试在分配后立即调用stop()函数,但这也没有任何区别。
我的智慧结束了。有没有办法让我将onclick事件分配给锚标记,而不会自动触发事件?我做错了什么?
解决方案
函数是Javascript中的第一类对象,这意味着您可以将它们分配给变量或将它们作为参数传递给其他函数。在您的代码中,您将函数调用与函数引用混淆。
看看这段代码:
$(anchor_id).observe('click', loadData(prv, dao_id, true));
这是什么将调用的结果传递给<!> quot; loadData <!> quot;到观察功能。你想要做的是传递对函数调用的引用。您可以通过将代码更改为:
来轻松修复它$(anchor_id).observe('click', function() { loadData(prv, dao_id, true) } );
不隶属于 StackOverflow