Question

我需要的网站需要在用户点击链接时对其进行检查，这些链接会将用户带到外部网站（不要问为什么，它只是......）

客户想要某种弹出框，然后“你真的想去吗？”是和否的2个按钮。

到目前为止，我已经在经典的浏览器弹出窗口中完成了所有这些操作，因为如果JS关闭，它会优雅地降级，只留下计划ahref链接。我的问题是......有没有另外一种方法可以做到这一点，比普通的'糟糕的弹出窗口更加时髦？

我一直在试验thickbox和一些JQuery sliders但是只要你禁用了Javascript

a）没有“弹出窗口” b）即使链接不再指向它应该去的位置，这要归功于激活不再工作的“弹出窗口”所需的标记

任何想法或想法？：P

Answer 1

你应该做的是这样的事情：

$("a.outside").click(function (){
  openPopupWithThickbox();
  var result = getResultFromThickbox();
  return result;
});

如果用户点击“否”，这将阻止链接激活，但如果用户想要离开网站，则会有效。

当然，它也会优雅地降级。

Answer 2

鉴于可用的选项很多，我会选择jQuery UI的dialog component。

Answer 3

答案是使用thickbox：

<a href="http://www.whatever.com" onclick="tb_show('Warning', 'ajax.html?height=300&width=440', 'thickbox');return false">

然后你可以检索ajax.html（或其他）并显示。如果要使用按钮关闭厚箱，只需添加：

<a href="#" onclick="tb_remove()">

Answer 4

我有一个请求在使用jQuery的页面上执行此操作，并提出了这个：

jQuery( function () {
  jQuery( '#warn-dialog' )
    .dialog({
      autoOpen: false,
      modal: true,
      buttons : { 
        'Yes' : function () { 
          document.location.href = jQuery( '#email-link' ).attr( 'href' );
        },
        'No' : function () { 
          jQuery( '#warn-dialog' ).dialog( 'close' ); 
        }
      }
    });
  jQuery( '.warn-link' ).click( function ( event ) {
    event.preventDefault();
    jQuery( '#warn-dialog' ).dialog( 'open' );
  });
});

使用HTML：

<div id="warn-dialog" class="ui-helper-hidden" title="Warning">
  <p>Are you sure you want to leave?</p>
</div>

<p>
  <a class="warn-link" href="http://link1.com">link1</a>
  <a class="warn-link" href="http://link2.com">link2</a>
</p>

web2.0弹出？

4 个答案: