Javascript 如何将onclick添加到文本行中，使其仅在单击时调用弹出框，而不在页面加载时调用？

多亏了另一个用户的帮助，我能够定制一个看起来很棒的弹出窗口，但是我不能完全让onclick正常工作，所以只有在点击电话号码后才会显示弹出窗口。我想自己显示电话号码，一旦点击，就会出现一个弹出窗口，询问用户“呼叫还是文本？”，然后用户点击他们选择的按钮。谢谢大家!

var modal = document.getElementById('textCall');
var span = document.getElementById("close");
modal.style.display = "block";
span.onclick = function(){
modal.style.display = "none";
}

CSS

HTML

555-5555
&时代；
打电话还是发短信？

您正在寻找此功能：

function textCall(e) {
    modal.style.display = "block";
}

检查代码段：

var modal = document.getElementById('textCall');
var span = document.getElementById("close");
var number = document.getElementById("number");

number.onclick = function() {
    modal.style.display = "block";
};
span.onclick = function() {
    modal.style.display = "none";
};

var modal=document.getElementById（'textCall'）；
var span=document.getElementById（“关闭”）；
span.onclick=函数（）{
modal.style.display=“无”；
};
函数textCall（e）{
modal.style.display=“块”；
}

对话{
显示：无；
位置：固定；
z指数：1；
填充顶部：150px；
左：0；
排名：0；
宽度：100%；
身高：100%；
溢出：自动；
背景色：rgba（0,0,0,0.4）；
}
#数{
光标：指针；
}
#关闭，#关闭{
颜色：#AAAAA；
浮动：对；
字号：28px；
字体大小：粗体；
}
#关闭：悬停，
#结束：聚焦，
#关闭：焦点，
#关闭：悬停{
颜色：#000000；
文字装饰：无；
光标：指针；
}
.模态内容{
背景色：#fefe；
保证金：自动；
填充：20px；
边框：1px实心#888；
宽度：40%；
}

555-5555

&时代； 打电话还是发短信？

---

为此，您首先需要将

显示：'none'

设置为您的模式。您可以对元素执行

onclick

功能，并执行

show

或

hide

这样的模式

演示

功能关闭模式（e）{
document.getElementById（'textCall'）.style.display=“无”；
}
函数textCall（e）{
document.getElementById（'textCall'）.style.display=“block”；
}

对话{
显示：无；
位置：固定；
z指数：1；
左：0；
排名：0；
宽度：100%；
身高：100%；
溢出：自动；
背景色：rgba（0,0,0,0.4）；
}
.号码{
光标：指针；
}
#接近，
#封闭的{
颜色：#AAAAA；
浮动：对；
字号：28px；
字体大小：粗体；
}
#关闭：悬停，
#结束：聚焦，
#关闭：焦点，
#关闭：悬停{
颜色：#000000；
文字装饰：无；
光标：指针；
}
.模态内容{
背景色：#fefe；
保证金：自动；
填充：20px；
边框：1px实心#888；
宽度：40%；
位置：固定；
最高：25%；
左：25%
}

555-5555
&时代；
打电话还是发短信？

这对于onclick非常有效，但它仍然在页面加载时加载弹出框。有没有办法让弹出框在单击数字之前不加载？非常感谢你的帮助@亲爱的宝贝，詹姆斯，我已经按照你的预期编辑了这个问题。请试一试。谢谢你的帮助。它阻止了页面加载时弹出窗口的执行，但现在单击时弹出窗口消失了。

function textCall(e) {
    modal.style.display = "block";
}

var modal = document.getElementById('textCall');
var span = document.getElementById("close");
var number = document.getElementById("number");

number.onclick = function() {
    modal.style.display = "block";
};
span.onclick = function() {
    modal.style.display = "none";
};