单击显示电子邮件地址

Question

我有以下代码，允许我在点击时显示电子邮件地址。问题是我想要显示电子邮件当我点击它时，它会消失，只返回电子邮件地址。

你能帮帮我吗?

谢谢!

function SEmail() {
var x = document.getElementById('email');
if (x.style.display == 'none') {
x.style.display = 'block';
}
}

<p class="email">
<?php _e('E-mail:', 'theme') ?>
<span onclick="SEmail()"><a href="#">Show E-mail</a></span>
<span id="email" style="display:none"><a href="mailto:<?php echo contact_email(); ?>">Email link</a></span>
</p>

Answer 1

只需添加另一个函数来隐藏它

试试这个HTML:

<p class="email">
<?php _e('E-mail:', 'theme') ?>
<span onclick="SEmail()"><a href="#">Show E-mail</a></span>
<span onclick="HideEmail()" id="email" style="display:none"><a href="mailto:<?php echo contact_email(); ?>">Email link</a></span>
</p>

JavaScript

function SEmail() {
var x = document.getElementById('email');
if (x.style.display == 'none') {
x.style.display = 'block';
} else  {
x.style.display = 'none';
}
}
function HideEmail() {
var x = document.getElementById('email');
x.style.display = 'none';

}

Answer 2

通过给文本占位符文本的Id:

<script>
function SEmail() {
var x = document.getElementById('email');
x.style.display = 'block';
var y = document.getElementById('text');
y.style.display = 'none';
}
</script>

<p class="email">
<?php _e('E-mail:', 'theme') ?>
<span id="text" onclick="SEmail()"><a href="#">Show E-mail</a></span>
<span id="email" style="display:none"><a href="mailto:<?php echo contact_email(); ?>">Email link</a></span>
</p>

感谢帮助@ChrisG和@isherwood