如何创建一个可以与嵌入代码一起使用的按钮？答案

【问题标题】：How to create a button that can be used with embed code?如何创建一个可以与嵌入代码一起使用的按钮？
【发布时间】：2012-07-15 10:16:39
【问题描述】：

我正在开发一个需要创建可嵌入按钮的项目。我只是想给客户一些代码，并要求他们把它放在他们希望按钮出现在他们网站上的地方。最好的方法是什么？例如，请看下图：

如果有人能提供一些示例代码，我将非常感激。

【问题讨论】：

你希望这个按钮做什么？您需要在此处提供有关您要实现的目标的更多详细信息。
好吧，你为什么不给他们你用来显示按钮的相同代码呢？ ...
对不起...我希望此按钮仅重定向到相应客户的注册和登录页面，即客户的客户将单击该按钮以重定向到我们的登录、注册页面该客户的系统。我希望这能解决问题。
如果是这样，那么让它成为一个简单的链接？

标签： javascript html css asp.net-mvc-3 razor

【解决方案1】：

最简单的形式是提供超链接：

<a href="http://mysite.com/dosomething" title="DoSomething">Do Something</a>

或者你可以使用图片按钮：

<a href="http://mysite.com/dosomething" title="DoSomething">
    <img src="http://mysite.com/images/a.jpg" alt="DoSomething" />
</a>

这些都消除了对 CSS 和 JS 的依赖。

或者您可以按照问题中的建议进行操作：

<script src="http://mysite.com/scripts/embedbutton.js">
    document.write('<link rel="stylesheet" href="http://mysite.com/css/embedbutton.css" />');
    document.write('<div id="mybutton" onclick="DoSomething(event);">DoSomething</div>');

    function DoSomething()
    {
        /* action code here */
    }
</script>

【讨论】：

【解决方案2】：

我认为 javascript 解决方案是您需要的解决方案。创建一个 javascript 来编写按钮的 HTML。例如将代码放在 public/js/mybutton.js 中。

var link = 'http://yoursite.com';
var text = '<div><a href="' + link + '"><img src="' 
    + link 
    + '/public/images/image.png" alt="Some alt text for the image" /></a></div>';
document.write(text);

然后在您的页面中提供一个脚本标签，供用户嵌入您的按钮。

<script src="http://yoursite.com/public/js/mybutton.js"></script>

结果将是带有指向您网站的链接的图像，在脚本之后立即呈现。您也可以使用内联样式。我相信当您想要防止修改按钮样式时，这是一个不错的选择。

【讨论】：

【解决方案3】：

你可以使用一个简单的链接：

<a href="http://yoursite.com">Blah</a>

然后请您的客户将此代码嵌入到他们的网站中。显然，根据您需要在客户端站点和您的站点之间交换的信息，可能会有其他参数、javascript 代码......

【讨论】：

但我也想要按钮样式。如果我在按钮的样式标签中也传入样式属性可以吗？
您可以使用<img> 标记并指向您网站上的图像，使其成为图像按钮或其他东西。