如何在输入提交按钮被点击时添加fancybox？

显然它看起来像这个fancybox只适用于具有ID或类的锚定标记，但我想在提交按钮中使用它...有没有一种方法可以在该元素中使用它？如何在输入提交按钮被点击时添加fancybox？

例如这不起作用，因为需要的fancybox一个href，这将拉动内容

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

看中框代码

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

来源

2013-02-22 sasori

你在想什么/想要在fancybox中显示？ – lukeocom 2013-02-22 07:25:04

You miss＃ $（“＃submitme”）。fancybox（）;将工作如果它的有用的感谢 – 2013-02-22 07:30:59

要显示另一个表单，并且这个表单在花哨的框中，也将有一个提交按钮，因此，它将提交数据从它自己的输入字段和从家长表格数据 – sasori 2013-02-24 14:42:33

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

因此，有这样的：如果你硬编码

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

...将工作缺少的元素href和type在德，崔根源脚本，如：

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

见JSFIDDLE

或者，您可以硬编码任何htm升的内容太像：

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

见JSFIDDLE

来源

2013-02-22 08:40:23 JFK

通过＃参考它，

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

来源

2013-02-22 07:21:25 EnterJQ

不起作用，我使用ID或类别..因为它是一种输入类型的元素，fancybox需要一个标记和一个href – sasori 2013-02-22 07:30:55

你缺少节点引用中的＃。但这可能只是因为你在问题中输入了你的代码。你总是可以样式的超链接看起来像一个按钮，给它一个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();

来源

2013-02-22 07:29:31

我没有显示CSS，主要是因为它并不重要。如果你想让你的链接看起来像一个按钮，你基本上想要设置边框，边距，显示：块和背景颜色。 – 2013-02-22 07:30:47

是否没有其他方式使用提交按钮而不是使用该标签？ – sasori 2013-02-22 07:49:25

是的，但是当您中断提交按钮的默认行为时，Internet Explorer无法正常播放。这当然值得一试。如果你喜欢，你可以使用我的jQuery代码和按钮。我对结果感兴趣。对不起，我没有时间调查。 – 2013-02-22 08:14:11

我试图加入到shopify

<form action="//mailchimpurlcodehere" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate> 


<input type="email" value="" name="EMAIL" style="padding:10px; background:#C7DAE5; border:0px; color:#000; width:220px; font-weight:bold;" id="mce-EMAIL" placeholder="Email address here" required><input style="padding:10px; background:#134F73; border:0px; color:#000; font-weight:bold;" type="submit" value="STAY TUNED" name="subscribe" id="mc-embedded-subscribe" class="button"

这一点，但我不知道在哪里把JavaScript字符串它不起作用。我甚至尝试添加一个文件夹，并将其命名为jquery.fancybutton.js此代码：

$("#mc-embedded-subscribe").fancybox({ 
type : "iframe", 
href : "mailchimpurlcodehere"});

，所以我可以将其添加为{{“jquery.fancybutton.js” | shopify_asset_url | script_tag}}但它没有工作的帮助。

来源

2015-05-09 22:37:31 Shane

如何在输入提交按钮被点击时添加fancybox？

回答

相关问题