Question

是否有一些脚本可以阻止<herf="#">刷新页面？

你可能会问为什么我会这样做？好吧，我正在增强一个旧的.net网络项目，它使用nyroModal jQuery打开一个灯箱，但当我尝试关闭灯箱时，nyroModal在URL的末尾应用一个哈希值（即#）并导致页面刷新，这会导致屏幕翻转（糟糕的用户体验）

Javascript代码：

$(function () {
    //set up light box
    var width = 766;
    var height = 591;
    $('.nyroModal').nyroModal({
        sizes: {
            initW: width, initH: height,
            minW: width, minH: height,
            w: width, h: height
        },
        callbacks: {
            beforeShowCont: function () {
               =$('html').css('overflow', 'hidden');
               =//width = $('.nyroModalCont').width();
               =//height = $('.nyroModalCont').height();
               =$('.nyroModalCont').css('width', width);
               =$('.nyroModalCont').css('height', height);
               =$('.nyroModalCont iframe').css('width', width);
               =$('.nyroModalCont iframe').css('height', height);
            =},
            =afterResize: function () {
               $('html').css('overflow', 'hidden');
            },
            afterShowCont: function () {
               $('html').css('overflow', 'hidden');
            },
            afterClose: function () {
               $('html').css('overflow', 'auto');
               //resizeBackground();
            }
         }
     });
 });

如果有人能告诉我如何使用URL末尾的哈希来解决这个令人耳目一新的问题，那就太棒了。或者刷新后，我的屏幕位置保持不变。感谢不上升或下降

Answer 1

<a href="#" onclick="return false;">Link</a>

这会阻止您的网页重新加载。

Answer 2

对于我的项目，我添加此代码以防止在单击$property = "user->name"; $prop_arr = explode('->',$property); foreach ($prop_arr as $prop){ $obj = $obj->{$prop}; } echo $obj;的锚点时出现混蛋（当页面滚动到顶部时）：

href=#

这样你就不需要去每个锚标签并禁用它。如果有一些特殊的锚标记，您可以轻松地排除那些使用某个选择器或在此单击处理程序中添加一些条件。

如果你不想要这种行为，可以直接从你的javascript中删除这些行，不需要修改你的html代码。

Answer 3

将javascript:void(0)放在href中：

<a href="javascript:void(0);">Anchor</a>

再试一次。

Answer 4

当您编写href="#"时，它会搜索#id指定的ID。
下面的代码是在当前页面上工作并用于运行javascript函数。

<a href="javascript:void(0);" onclick="function()">Link</a>

Answer 5

您可以通过CSS

来完成

＆＃13;

    .notActive {
       pointer-events: none;
       cursor: default;
    }

＆＃13;

<a href="#" class="notActive"> Disabled link </a>

＆＃13;

Answer 6

解决这个问题的方法是，如果锚点仅由'＃'组成，则可以防止动作。大。你走了：

 $(document).ready(function(){
    $('a').on('click',function(e){
        // Explicit check
                // $(e.target).is('a')
            if($(e.target).attr('href').lastIndexOf('#')!=-1){
                     e.preventDefault();
                }
    });
});

链接：https://jsfiddle.net/Ashokkumargupta/5rs4621w/

注意：上述代码的好处是避免意外链接，默认情况下也具有“目标”属性。

希望这有帮助！

谢谢，

阿肖克

JavaScript是否有办法阻止href =“＃”刷新页面？ nyroModal

Javascript代码：

6 个答案: