禁用链接或阻止浏览器重定向

时间:2014-08-24 11:56:31

标签: javascript jquery

小提琴 - http://liveweave.com/gWoHkb

我一直在为网页设计应用程序构建一个入门模板/演示,今天我遇到了一个问题。

当我选择一个主播时,我不希望它重定向浏览器。

我知道我可以使用javascript:void(0)#'哈希'为此,我不想改变它的哈希我只是不想在设计时遇到问题。

所以我通过return false;.on(click mousedown touchstart mouseup touchend)申请了mouseup touchend。我注意到,当我这样做时,我选择的元素的拖拽方法也设置为返回false,所以即使我的鼠标上升也一直拖动。 (不要假设发生)

虽然这解决了重定向问题,这也导致了更大的问题。所以我从该函数中删除了$('#canvas').children().filter("a").on('click mousedown touchstart', function() { return false; }).on('mouseup touchend', function() { return true; }); 。制作一个新的将下面的内容设置为true。

target="_blank"

所以我决定走另一条路。当选择工具或编辑工具处于活动状态时,我将具有target="_self"属性的所有锚点设置为// Ask if they want to leave. var hook = true; window.onbeforeunload = function() { if (hook) { return "All your stuff may not be saved. Are you sure you want to leave?" } } function unhook() { hook=false; }

现在,我知道如何防止重定向的唯一方法是使用unbeforeunload,它始终会提示出一个对话框。

{{1}}

我无论如何都不知道绕过对话并留在页面上。

根据@duskwuff,当使用onbeforeunload要求浏览器进行重定向时,您无法让用户停留。

我一直在寻找并寻找解决方案,但我似乎无法找到解决问题的解决方案。

如果有人能帮助它,我们将非常感激。

1 个答案:

答案 0 :(得分:0)

小提琴 - http://codepen.io/mikethedj4/pen/gCsih

我能想出的唯一解决方案是刷新画布。

$("#code").val($("#canvas").html());
$("#canvas").html($("#code").val());

我使用了#canvas的html并将其设置为textarea的值。 然后我将该textarea值应用为画布的html。

$('#canvas').children().drag("start",function( ev, dd ){
  dd.attrc = $( ev.target ).prop("className");
  dd.attrd = $( ev.target ).prop("id");
  dd.width = $( this ).width();
  dd.height = $( this ).height();
}).drag(function( ev, dd ){
  var props = {};
  if ( dd.attrc.indexOf("E") > -1 ){
    props.width = Math.max( 32, dd.width + dd.deltaX );
  }
  if ( dd.attrc.indexOf("S") > -1 ){
    props.height = Math.max( 32, dd.height + dd.deltaY );
  }
  if ( dd.attrc.indexOf("W") > -1 ){
    props.width = Math.max( 32, dd.width - dd.deltaX );
    props.left = dd.originalX + dd.width - props.width;
  }
  if ( dd.attrc.indexOf("N") > -1 ){
    props.height = Math.max( 32, dd.height - dd.deltaY );
    props.top = dd.originalY + dd.height - props.height;
  }
  if ( dd.attrd.indexOf("stylethis") > -1 ){
    props.top = dd.offsetY;
    props.left = dd.offsetX;
  }
  $('#stylethis').css( props );
}, {relative:true})
.on('dblclick', function() {
  EditableStylez();
  return false;
})
.filter("a").on('click mousedown touchstart', function() {
  return false;
}).on('mouseup touchend', function() {
  $("#code").val($("#canvas").html());
  $("#canvas").html($("#code").val());
  HandleSelectedElement();
  return false;
});

我真的很讨厌必须这样做,因为那里的元素越多,刷新越多,它使用的ram就越多,这使得浏览器更难以运行cpu。

我希望有人能找到更好的解决方案。