在链接中使用 Button 实现 Modal 的问题

Question

我正在开发一个现有的 MVC4 应用程序，并且需要实现一个模态表单。

我正在尝试实施此解决方案...

http://jsfiddle.net/kumarmuthaliar/GG9Sa/1/

这工作得很好，但是这个例子使用了一个链接，我需要它是一个按钮。

我可以尝试将链接样式设置为按钮，但在同一个表单上还有很多其他按钮，并且它需要看起来与这些按钮完全一样，而且我还没有找到一个很好的方法来设置与链接完全相同的样式每个浏览器中的其他按钮，因为大多数按钮的默认样式属性都没有被覆盖。

我尝试将链接包裹在按钮周围，如下所示...

<a href="#MathFactsModal"><button type="button">Continue</button></a>

这在 Chrome 中运行良好，但在 IE11 中，当我测试该按钮时会显示，但当我单击它时不会执行任何操作。同样，完全相同的代码在 Chrome 中运行良好 - 按下按钮确实会弹出模式打开，但在 IE 中不起作用。此外，当按钮嵌套在链接中时，您会收到 HTML5 验证警告。

那么，我该怎么做才能使我的链接看起来与我的所有其他按钮完全一样？或者有什么方法可以在不使用指向锚点的链接的情况下实现这种模式解决方案？

Answer 1

不确定为什么您当前的示例不起作用，但此堆栈溢出问题/答案Here 中有很多示例。