如何在单击输入提交按钮时添加fancybox

how to add fancybox when an input submit button is clicked?

本文关键字：按钮 添加 fancybox 提交 输入 单击      更新时间：2023-09-26

显然，这个fancybox似乎只适用于具有ID或类的锚标记？，但我想在提交按钮中使用它。。。有办法在那个元素中使用它吗？

例如，这不起作用，因为fancybox需要一个href来提取内容

<input type="submit" id="submitme" name="submitme" value="SUBMIT ME" />

花式盒码

$("#submitme").fancybox();

通过#引用，

$("#submitme").fancybox();

问题不在于fancybox是否可以绑定到submit按钮。实际问题是，你的submit按钮没有告诉fancybox要打开的目标内容和内容的type。

所以有了这个：

<input type="submit" id="submitme" name="submitme" value="SUBMIT ME" />

如果您对costom脚本中缺少的元素href和type进行硬编码，则会起作用，例如：

$("#submitme").fancybox({
    type : "iframe",
    href : "http://jsfiddle.net"
});

请参阅JSFIDDLE

可选地，您可以硬编码任何html内容，如：

$("#submitme").fancybox({
    content : "<p>Any html as content</p>"
});

请参阅JSFIDDLE

您的节点引用中缺少#。但这可能只是因为你在问题中键入了代码。你可以把一个超链接设计成一个按钮，给它一个URL，然后把fancybox附加到它上：

<!--<input type="submit" id="submitme" name="submitme" value="SUBMIT ME" />-->
<a href="somewhere.htm" id="submitme" name="submitme" value="SUBMIT ME" >SUBMIT ME</a>
$("#submitme").click(function(event){
    event.preventDefault();//stop the hyperlink from navigating away from the current page
}).fancybox();
相关文章：