Question

我有一个href标记，其中包含指向其他网页的链接。

 <a name="mylink" class="mylink" href="path-to-new-page.html">Link to new page</a>

我在此尝试实现的是，当用户点击链接时，会触发onclick事件。像回报一样确认。

onclick="return confirm('would you like to see our help center first?')"

如果用户点击“是”，则会将其重定向到help.html页面。

如果他点击“否”，他将被发送到原始href的链接。

我必须使用弹出窗口而不是警告框来使用jquery吗？

Answer 1

首先回答您的第二个问题，您不必这样做，因为您可以在Javascript中获得内联警报框的结果。

至于<a>标签上的onclick，听起来就像一个按钮。语法与链接相同，除非您执行以下操作：

<button onclick='myFunction()'>Click Here</button>

然后你的javascript看起来像：

function myFunction(){
    if(confirm("Would you like to see our help center first?")){
        // what happens if they select yes //
        document.href.location = "helpcenter.html";
    }else{
        // what happens if they select no //
        document.href.location = "linktarget.html";
    }
}

当然，helpcenter.html是您的帮助中心，linktarget.html是该链接的原始目标网址。

confirm()只返回一个布尔值，表示他们是否按下了对象（true）或取消了对话框顶部的x，false）和{{ 1}}与说document.href.location

完全相同

Answer 2

免责声明：我在此演示中使用了个人网址，将来可能会消失，但其名称仍应易于理解。

没有jQuery

＆＃13;

var links = document.getElementsByClassName('myLink');

for(var i=0, l=links.length; i<l; i++){
  links[i].addEventListener('click', function(e){
    var goToHelpCenter = confirm('Would you like to see our help center first?');
    if(goToHelpCenter){
      // Prevent the link from going to its default href
      e.preventDefault();
      // Go to help center
      window.location.href = 'http://shrt.tf/help-center.html';
    }
    // Otherwise, do nothing.
  });
}

＆＃13;

<a class="myLink" href="http://shrt.tf/page.html">Click me</a>

＆＃13;

jQuery版

＆＃13;

$('.myLink').click(function(e){
  var goToHelpCenter = confirm('Would you like to see our help center first?');
  if(goToHelpCenter){
    // Prevent the link from going to its default href
    e.preventDefault();
    // Go to help center
    window.location.href = 'http://shrt.tf/help-center.html';
  }
  // Otherwise, do nothing.
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<a class="myLink" href="http://shrt.tf/page.html">Click me</a>

＆＃13;

功能onclick打开新链接，没有转到原始链接

2 个答案: