我在使用jQuery伪造锚点击时遇到问题: 为什么我的厚箱出现在我第一次点击输入按钮时,而不是第二次或第三次出现?
这是我的代码:
<input onclick="$('#thickboxId').click();" type="button" value="Click me" />
<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>
当我直接点击链接时,它总是有效,但如果我尝试通过输入按钮激活厚箱,则无效。这是在FF。对于Chrome,它似乎每次都有效。任何提示?
答案 0 :(得分:191)
对我有用的是:
$('a.mylink')[0].click()
答案 1 :(得分:122)
尽量避免像这样内联你的jQuery调用。在页面顶部放置一个脚本标记以绑定到click
事件:
<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
:
<script type="text/javascript">
$(function(){
$('#thickboxButton').click(function(){
window.location = $('#thickboxId').attr('href');
});
});
</script>
编辑2:
现在我意识到Thickbox是一个自定义的jQuery UI小部件,我找到了here的说明:
<a href>
)class="thickbox"
)href
属性中添加以下锚点:#TB_inline
在href
之后的#TB_inline
属性中,将以下查询字符串添加到锚点:
高度= 300安培;宽度= 300安培; inlineId = myOnPageContent
相应地更改查询中height,width和inlineId的值(inlineID是包含您希望在ThickBox中显示的内容的元素的ID值。
#TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true
),以便关闭ThickBox将需要从ThickBox中调用tb_remove()
函数。请参阅隐藏模式内容示例,您必须单击“是”或“否”才能关闭ThickBox。答案 2 :(得分:19)
我最近发现了如何通过jQuery触发鼠标点击事件。
<script type="text/javascript">
var a = $('.path > .to > .element > a')[0];
var e = document.createEvent('MouseEvents');
e.initEvent( 'click', true, true );
a.dispatchEvent(e);
</script>
答案 3 :(得分:8)
这种方法适用于firefox,chrome和IE。希望它可以帮助某人:
var comp = document.getElementById('yourCompId');
try { //in firefox
comp.click();
return;
} catch(ex) {}
try { // in chrome
if(document.createEvent) {
var e = document.createEvent('MouseEvents');
e.initEvent( 'click', true, true );
comp.dispatchEvent(e);
return;
}
} catch(ex) {}
try { // in IE
if(document.createEventObject) {
var evObj = document.createEventObject();
comp.fireEvent("onclick", evObj);
return;
}
} catch(ex) {}
答案 4 :(得分:6)
问题标题说“如何在jQuery中模拟锚点击?”。好吧,您可以使用“trigger”或“triggerHandler”方法,如下所示:
<script type="text/javascript" src="path/to/jquery.js"></script>
<script type="text/javascript" src="path/to/thickbox.js"></script>
<script type="text/javascript">
$(function() {
$('#btn').click(function() {
$('#thickboxId').triggerHandler('click');
})
})
</script>
...
<input id="btn" type="button" value="Click me">
<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>
没有经过测试,这是一个实际的剧本,但之前我曾使用过trigger
等人,他们一直在工作。
<强>更新强>
triggerHandler
实际上没有做OP想要的事情。我认为1421968为这个问题提供了最佳答案。
答案 5 :(得分:6)
虽然这是一个非常古老的问题,但我发现更容易处理这项任务。它是由jquery UI团队开发的名为simulate的jquery插件。你可以在jquery之后包含它然后你可以做类似的事情
<a href="http://stackoverflow.com/"></a>
$('a').simulate('click');
在chrome,firefox,opera和IE10中运行良好。你可以从https://github.com/eduardolundgren/jquery-simulate/blob/master/jquery.simulate.js下载
答案 6 :(得分:5)
我建议查看Selenium API,了解它们如何以浏览器兼容的方式触发元素点击:
查找BrowserBot.prototype.triggerMouseEvent
函数。
答案 7 :(得分:4)
我相信你可以使用:
$('#yourLink').bind('click', function() {
//Do something over here
});
$('#yourLink').trigger('click');
这很容易触发点击功能,而不会实际点击它。
答案 8 :(得分:2)
你需要伪造锚点击吗?来自thickbox网站:
可以从链接元素,输入元素(通常是按钮)和区域元素(图像映射)调用ThickBox。
如果这是可以接受的,它应该像在输入本身上放置thickbox类一样简单:
<input id="thickboxButton" type="button" class="thickbox" value="Click me">
如果没有,我建议使用Firebug并在锚元素的onclick方法中放置断点,以查看它是否仅在第一次单击时触发。
编辑:
好的,我必须为自己尝试,对我来说,几乎你的代码在Chrome和Firefox中都有效:
<html>
<head>
<link rel="stylesheet" href="thickbox.css" type="text/css" media="screen" />
</head>
<body>
<script src="jquery-latest.pack.js" type="text/javascript"></script>
<script src="thickbox.js" type="text/javascript"></script>
<input onclick="$('#thickboxId').click();" type="button" value="Click me">
<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>
</body>
</html>
无论是否单击输入或锚元素,窗口都会弹出窗口。如果以上代码适合您,我建议您的错误位于其他地方并且您尝试隔离问题。
另一个可能是我们使用不同版本的jquery / thickbox。我正在使用我从thickbox页面获得的内容 - jquery 1.3.2和thickbox 3.1。
答案 9 :(得分:2)
在Javascript中你可以这样做
function submitRequest(buttonId) {
if (document.getElementById(buttonId) == null
|| document.getElementById(buttonId) == undefined) {
return;
}
if (document.getElementById(buttonId).dispatchEvent) {
var e = document.createEvent("MouseEvents");
e.initEvent("click", true, true);
document.getElementById(buttonId).dispatchEvent(e);
} else {
document.getElementById(buttonId).click();
}
}
你可以像
一样使用它submitRequest("target-element-id");
答案 10 :(得分:2)
如果你不需要使用JQuery,我不需要。我遇到了.click()
的跨浏览器功能问题。所以我用:
eval(document.getElementById('someid').href)
答案 11 :(得分:2)
要在登陆页面时模拟锚点击,我只是使用jQuery为$(document).ready.
中的scrollTop属性设置动画,不需要复杂的触发器,这适用于IE 6和其他所有浏览器。 / p>
答案 12 :(得分:2)
您可以通过jQuery或HTML页面代码创建表单,并使用模仿链接href的操作:
<a id="anchor_link" href="somepath.php">click here</a>.
var link = $('#anchor_link').attr('href');
$('body').append('<form id="new_form" action="'+link+'"></form>');
$('#new_form').submit();
答案 13 :(得分:1)
JQuery('#left').triggerHandler('click');
在Firefox和IE7中运行良好。我没有在其他浏览器上测试它。
如果要触发自动用户点击,请执行以下操作:
window.setInterval(function()
{
$('#left').triggerHandler('click');
}, 1000);
答案 14 :(得分:1)
使用Jure的脚本我做了这个,轻松地“点击”了你想要的任意数量的元素 我刚刚在1600多种商品上使用了谷歌阅读器,它完美运行(在Firefox中)!
var e = document.createEvent('MouseEvents');
e.initEvent( 'click', true, true );
$(selector).each(function(){this.dispatchEvent(e);});
答案 15 :(得分:0)
这不适用于Android原生浏览器点击&#34;隐藏输入(文件)元素&#34;:
$('a#swaswararedirectlink')[0].click();
但这有效:
$("#input-file").show();
$("#input-file")[0].click();
$("#input-file").hide();
答案 16 :(得分:0)
尝试模拟“点击”按钮。在使用jQuery UI微调器的单元测试中,我无法获得任何以前的工作答案。特别是,我试图模拟&#39;旋转&#39;选择向下箭头。我查看了jQuery UI spinner unit tests,他们使用以下方法,这对我有用:
element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup();