如何通过 jquery 模拟锚点点击? [英] How can I simulate an anchor click via jquery?

问题描述

我在通过 jQuery 伪造锚点点击时遇到问题:为什么我第一次点击输入按钮时出现thickbox，第二次或第三次没有出现?

I have a problem with faking an anchor click via jQuery: Why does my thickbox appear the first time I click on the input button, but not the second or third time?

这是我的代码:

<input onclick="$('#thickboxId').click();" type="button" value="Click me" />

<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>

当我直接单击链接时它总是有效，但如果我尝试通过输入按钮激活厚框则无效.这是在FF.对于 Chrome，它似乎每次都有效.有什么提示吗?

It does always work when I click directly on the link, but not if I try to activate the thickbox via the input button. This is in FF. For Chrome it seems to work every time. Any hints?

推荐答案

尽量避免像这样内联你的 jQuery 调用.在页面顶部放置一个脚本标签以绑定到 click 事件:

Try to avoid inlining your jQuery calls like that. Put a script tag at the top of the page to bind to the click event:

<script type="text/javascript">
$(function(){
    $('#thickboxButton').click(function(){
        $('#thickboxId').click();
    });
});
</script>

<input id="thickboxButton" type="button" value="Click me">
<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>

如果您试图模拟用户实际点击链接，那么我认为这是不可能的.一种解决方法是更新按钮的 click 事件以更改 Javascript 中的 window.location:

If you're trying to simulate a user physically clicking the link, then I don't believe that is possible. A workaround would be to update the button's click event to change the window.location in Javascript:

<script type="text/javascript">
$(function(){
    $('#thickboxButton').click(function(){
        window.location = $('#thickboxId').attr('href');
    });
});
</script>

编辑 2:

现在我意识到Thickbox 是一个自定义的jQuery UI 小部件，我在这里找到了说明:

Now that I realize that Thickbox is a custom jQuery UI widget, I found the instructions here:

• 创建链接元素(<a href>)

给链接一个值为thickbox的类属性(class=thickbox")

Give the link a class attribute with a value of thickbox (class="thickbox")

在链接的 href 属性中添加以下锚点:#TB_inline

In the href attribute of the link add the following anchor: #TB_inline

在 #TB_inline 之后的 href 属性中，将以下查询字符串添加到锚点:

In the href attribute after the #TB_inline add the following query string on to the anchor:

?height=300&width=300&inlineId=myOnPageContent

?height=300&width=300&inlineId=myOnPageContent

相应地更改查询中的 height、width 和 inlineId 的值(inlineID 是包含您希望在 ThickBox 中显示的内容的元素的 ID 值.

Change the values of height, width, and inlineId in the query accordingly (inlineID is the ID value of the element that contains the content you would like to show in a ThickBox.

您可以选择将 modal=true 添加到查询字符串(例如 #TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true)，以便关闭厚框将需要从ThickBox 中调用tb_remove() 函数.请参阅隐藏的模态内容示例，您必须单击是"或否"才能关闭厚框.

Optionally you may add modal=true to the query string (e.g. #TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true) so that closing a ThickBox will require calling the tb_remove() function from within the ThickBox. See the hidden modal content example, where you must click yes or no to close the ThickBox.

这篇关于如何通过 jquery 模拟锚点点击?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！