模拟<a>-element in javascript</a>上的点击

时间:2011-09-01 10:36:20

标签: javascript jquery hyperlink click simulate

对于一个网站,我使用的是jQuery supzersized gallery脚本:http://buildinternet.com/project/supersized/slideshow/3.2/demo.html

正如您在演示中所看到的,在右下角有一个小箭头按钮,可以切换缩略图栏。配置文件中没有选项可以在打开网站时自动将其混合。

所以我想我必须模拟点击该按钮(按钮是托盘按钮,请参阅HTML)。我试过这样的事情:

<script>
$(function() {
    $('#tray-button').click();
});
</script>

然而,这似乎不适用于我测试的任何浏览器。

有什么想法吗?

7 个答案:

答案 0 :(得分:5)

$('#tray-arrow').click(function() {
 // prepare an action here, maybe say goodbye.
 //
 // if #tray-arrow is button or link <a href=...>
 // you can allow or disallow going to the link:
 // return true; // accept action
 // return false; // disallow 
});

$('#tray-arrow').trigger('click'); // this is a simulation of click

答案 1 :(得分:2)

试试这个

$("#tray-arrow").live("click", function () {
               // do something

            });

答案 2 :(得分:1)

我假设你想在页面加载时弹出缩略图栏#thump-tray

这是一种方法:

找到文件supersized.shutter.js并找到以下代码:

// Thumbnail Tray Toggle
$(vars.tray_button).toggle(function(){
    $(vars.thumb_tray).stop().animate({bottom : 0, avoidTransforms : true}, 300 );
    if ($(vars.tray_arrow).attr('src')) $(vars.tray_arrow).attr("src", vars.image_path + "button-tray-down.png");
    return false;
}, function() {
    $(vars.thumb_tray).stop().animate({bottom : -$(vars.thumb_tray).height(), avoidTransforms : true}, 300 );
    if ($(vars.tray_arrow).attr('src')) $(vars.tray_arrow).attr("src", vars.image_path + "button-tray-up.png");
    return false;
});

之后,添加:

$(vars.tray_button).click();

不要忘记在您的页面(插件中的demo.html),更改

<script type="text/javascript" src="theme/supersized.shutter.min.js"></script>

<script type="text/javascript" src="theme/supersized.shutter.js"></script>

答案 3 :(得分:1)

而不是使用

$(function(){
 //jquery magic magic
});

你知道这个女巫会在整页加载(图像等)之后运行你的jquery魔法吗?

$(window).load(function () {
  // jquery magic
});

并模拟你使用的点击// shuld与$('#tray-arrow')相同.Click();

$('#tray-arrow').trigger('click',function(){ })

示例:

$(window).load(function () {
  $('#tray-arrow').trigger('click',function(){ 
      alert('just been clicked!'); 
  })
});

答案 4 :(得分:0)

<script>
$(function() {
    $('#tray-arrow').click();
});
</script>

确保此代码在您的轮播初始化之后。

答案 5 :(得分:0)

这看起来像是触发器计时的问题。该插件还会加载文档加载,因此当您尝试绑定事件侦听器时,可能尚未创建该元素。 也许你需要在theme._init函数中添加监听器 http://buildinternet.com/project/supersized/docs.html#theme-init 或类似的地方。

答案 6 :(得分:0)

问题可能是您的插件检测到用户是否已启动点击(真正的鼠标点击),还是通过代码(使用$('#id').click()方法)。如果是这样,通过代码单击锚元素就无法获得任何结果。

检查插件的源代码。