在Javascript中使用来自图像的href = mailto链接[重复]
Posted
技术标签:
【中文标题】在Javascript中使用来自图像的href = mailto链接[重复]【英文标题】:Using href=mailto link from an image in Javascript [duplicate] 【发布时间】:2011-12-27 05:16:34 【问题描述】:我做了一个主页。如果您单击需要更改背景的任何位置,除非您单击带有联系人的图片。如果您单击带有联系人的图片,则应发送一封邮件以获取电子邮件地址。
现在一切正常,唯一的问题是当我单击带有a href mailto
的图片时,背景消失了。我不知道为什么它的工作方式不同,然后当我点击其他地方时..
这是主页:http://staehelinmeyer.carolburri.com/
一些代码:
<script type="text/javascript">
var x=1; //store which picture to show
var MAX=10; //store how much picture is
var n=1; //count until 10
var y=x; //prevent to not put the same image after itself
function imgchanger() //changes the image
n++; //count until 10
x= Math.floor(Math.random()*(MAX-1))+2; //generate a random number between 2 and MAX
if(x==y) //if its the same image like what was before
while(x==y)x= Math.floor(Math.random()*(MAX-1))+2; //generate a new number
if(n==MAX) //if its the MAX time of clicking
x=1; //show the first picture
n=1; //and begin the counting from one
//change the picture
document.getElementById("html").style.backgroundImage = "url(files/"+x+".jpg)";
if (x==1) //if its the first picture show the footer and the contact
document.getElementById("contact_name").style.visibility='visible';
document.getElementById("footer").style.visibility='visible';
else //else hide the footer and the contact
document.getElementById("contact_name").style.visibility='hidden';
document.getElementById("footer").style.visibility='hidden';
y=x; //save what was the picture
</script>
<body onclick="imgchanger()">
<div id="page-wrap">
<div style="height:0px; position:fixed; top:30px; right:5px; background-color:#f0f0f0;">
<img id="contact_name" src="files/contact_name.png" />
<a href="mailto:mail@mail.com">
<img src="files/contact.png"/>
</a>
</div>
<div id="footer" class="footer">
Sample text
</div>
</div>
</body>
【问题讨论】:
请提供一些代码。尽管我们可以从页面中获取它,但我们宁愿看到此处发布的相关代码。 @Koli 请将相关代码 sn-ps 嵌入到您的问题中(不仅仅是链接) 无法重现...当您单击该 mailto 链接时图片会发生变化,但这是预期的行为...也许您需要预加载图像以避免每次单击时(空白)加载时间。 .. 要添加到@Marcus,我们希望在此处查看相关代码,因为这样所有未来的该问题读者都能够阅读并理解该问题,而不管是否您的公共链接是否仍然可用(更不用说,一旦您解决了问题,该链接将无法帮助未来的用户了解最初的问题) 【参考方案1】:我测试了一下,看起来还不错,但是我点击mailto的时候背景好像是白色的,需要一些时间才能完全加载背景。
【讨论】:
问题是,如果你点击到mailto,白色背景来了。那是我不明白的。【参考方案2】:添加此代码:
$("a").bind("click", function(e)
e.stopPropagation();
);
【讨论】:
【参考方案3】:试试这个功能:
function imgchanger()
var x = Math.floor(Math.random()*11) //sets x to a random number between 1 and 10
document.getElementById("html").style.backgroundImage = "url(files/" + x + ".jpg)";
document.getElementById("contact_name").style.visibility='hidden';
document.getElementById("footer").style.visibility='hidden';
默认情况下,“contact_name”和“footer”元素应该是可见的。此代码生成一个介于 1 和 10 之间的随机数,然后隐藏您想要隐藏的两个元素,并且比您的代码小得多。
如果问题仍然存在,请在此处再次评论,我会再看一下。
【讨论】:
10 次更改后,我需要使用页脚和名称获取 1 张图片...这就是为什么我的代码如此之长。 OK,添加一个计数器,就在函数调用之后:var i = 1; i++;【参考方案4】:有点像穆尼姆阿卜杜勒所说的尝试你可以添加以停止传播
<a href="mailto:mail@mail.com;" onclick="event.stopPropagation();">
【讨论】:
非常感谢,一切都解决了!以上是关于在Javascript中使用来自图像的href = mailto链接[重复]的主要内容,如果未能解决你的问题,请参考以下文章
使用 javascript 和 websockets 显示来自 blob 的图像
如何在预定义的 html 表中显示来自 javascript 数组的图像