单击UL链接打开弹出窗口



im在单击我的UL中的链接时试图制作它,它将打开一个简单的弹出框,并在该弹出框中使用几行文本。

  <ul>
   <li><a href="#introduction">About</a></li>
   <li><a href="#one">Portfolio</a></li>
   <li><a href="#">Contact</a></li>                 
   <li><a href="#">Resume</a></li>
  </ul> 

所以这是我的UL代码。当有人单击"联系"而不是将其链接到网站或其他页面时,我会喜欢它,它将打开一个弹出框,我可以将一些联系信息放入。

谢谢!

  • 您需要将事件click绑定到该链接。
  • 单击时防止该链接的默认行为。

document.getElementById("contact").onclick = function(e) { // bind the event click.
  e.preventDefault(); //Prevent the default behavior 
  alert('Some information from: ' + this.innerText + 'nn Details:nn Ele from Earth!');
}
<ul>
  <li><a href="#introduction">About</a></li>
  <li><a href="#one">Portfolio</a></li>
  <li><a href="#" id="contact">Contact</a></li>
  <li><a href="#">Resume</a></li>
</ul>

<ul>
<li><a href="#introduction">About</a></li>
<li><a href="#one">Portfolio</a></li>
<li><a href="#" onClick="a()">Contact</a></li>
<li><a href="#">Resume</a></li>
</ul>
<script>
function a () {
var contact = prompt("Add the contact.");
}
</script>

这将添加一个弹出框。其余的工作在于您。您是您选择的是要使用可变联系人的值将其显示在屏幕上还是通过表格提交。

最新更新