标签: anchor

如果执行onclick,如何禁用HREF?

我有一个锚 HREFONCLICK属性进行设置.如果单击并启用Javascript,我希望它只执行ONCLICK并忽略HREF.同样,如果Javascript被禁用或不受支持,我希望它遵循HREFURL并忽略ONCLICK.下面是我正在做的一个例子,它将执行JS并同时跟踪链接(通常执行JS然后页面更改):

<A HREF="http://example.com/no-js-login" ONCLICK="yes_js_login()">Log in</A>
Run Code Online (Sandbox Code Playgroud)

最好的方法是什么?

我希望得到一个Javascript答案,但我会接受任何方法,只要它有效,特别是如果这可以用PHP完成.我已经读过" 一个href链接执行并在javascript onclick函数能够完成之前重定向页面 ",但它只是延迟HREF,但并没有完全禁用它.我也在寻找更简单的东西.

html javascript anchor onclick href

80
推荐指数
7
解决办法
20万
查看次数

固定位置导航栏遮挡了锚点

我正在使用Twitter Bootstrap构建一个站点,并在页面顶部有一个40px固定位置导航栏.我设置了一些锚点以跳转到整个页面中的各种H1,但锚点目标最终被导航栏部分遮挡.有没有办法将链接偏移到导航栏的帐户?我已经看到一个建议将每个锚放在它自己的偏移div中,但这似乎是很多重复的代码,我想知道是否还有另一种方法.

如果可能的话,我宁愿用CSS而不是jQuery来做这件事,但任何解决方案都是受欢迎的.

.topbar {
   height: 40px;
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   z-index: 10000;
   overflow: visible;
}

body {
  padding-top: 40px; 
     /* 40px to make the container go all the way to the bottom of the topbar */
     font-family: 'Proxima', "Helvetica Neue", Helvetica, Arial, sans-serif;
     font-size: 14px;
     line-height: 18px;
      font-weight: normal;
      color: #555;
      background-color: #eee;
 }
Run Code Online (Sandbox Code Playgroud)

谢谢!

html css anchor

79
推荐指数
0
解决办法
3万
查看次数

访问时禁用锚标记的颜色更改

我必须在访问时禁用锚标记的颜色更改.我这样做了:

a:visited{ color: gray }
Run Code Online (Sandbox Code Playgroud)

(访问前链接为灰色).但这是我在访问链接后明确说明颜色的方式,这也是颜色变化.

如何在访问时禁用锚标记的颜色更改而不进行任何明确的颜色更改?

html css anchor

76
推荐指数
4
解决办法
17万
查看次数

CSS:纯CSS滚动动画

我一直在寻找一种方法来向下滚动时单击位于页面顶部的按钮仅使用CSS3.

所以我找到了这个教程:http://tympanus.net/codrops/2012/06/12/css-only-responsive-layout-with-smooth-transitions/

演示:http://tympanus.net/Tutorials/SmoothTransitionsResponsiveLayout/

但是由于我只是希望浏览器向下滚动页面顶部的一个按钮向下滚动,所以它有点太高级了,所以我想知道:是否可以在没有输入按钮的情况下进行那些CSS滚动,只是带锚标记?

HTML看起来像这样: <a href="#" class="button">Learn more</a>

我已经有一些CSS需要在按钮点击时触发:

/* Button animation tryout. */
.animate {
    animation: moveDown 0.6s ease-in-out 0.2s backwards;
}
@keyframes moveDown{
    0% { 
        transform: translateY(-40px); 
        opacity: 0;
    }
    100% { 
        transform: translateY(0px);  
        opacity: 1;
    }
}
Run Code Online (Sandbox Code Playgroud)

anchor scroll transition css3

75
推荐指数
2
解决办法
21万
查看次数

带有Javascript onclick事件的HTML锚标记

在使用Google时,我发现他们在锚标签中使用onclick事件.

在谷歌标题部分的更多选项中,它看起来像普通标签,但是点击它不会被重定向但是打开了一个菜单.通常在使用时

<a href='more.php' onclick='show_more_menu()'>More >>></a>
Run Code Online (Sandbox Code Playgroud)

它通常会在没有触发的情况下进入'more.php' show_more_menu(),但我在该页面中显示了一个菜单.谷歌怎么办?

javascript anchor onclick hyperlink

74
推荐指数
4
解决办法
43万
查看次数

如何使用AngularJS生成url编码的锚链接?

<a href="#/search?query={{address}}" ng-repeat="address in addresses">
  {{address}}
</a>
Run Code Online (Sandbox Code Playgroud)

如果我理解正确的话,会生成非url编码的链接.编码的正确方法是#/search?query={{address}}什么?

示例地址是1260 6th Ave, New York, NY.

anchor urlencode angularjs

73
推荐指数
5
解决办法
9万
查看次数

jQuery移动到页面加载时锚定位置

我有一个简单的页面设置,如:

<div id="aboutUs">
  About us content...
</div>
<div id="header">
  Header content...
</div>
Run Code Online (Sandbox Code Playgroud)

当页面加载时,我需要页面自动向下滚动(不需要动画)#header,因此除非向上滚动,否则用户无法看到关于我们的div.

#aboutUs 有一个固定的高度,所以没有任何变量来确定高度或任何东西......如果甚至需要.

我遇到了另一个问题并尝试修改我的情况的一些答案,但似乎没有任何工作.

任何帮助,将不胜感激.

anchor jquery scroll

71
推荐指数
3
解决办法
14万
查看次数

锚标记目标属性中_self,_top和_parent之间的差异

我知道_blank在与锚标签一起使用时会打开一个新选项卡,并且在使用框架集时我会使用自定义目标,但我想知道_parent,_self和_top之间的区别

html anchor hyperlink

71
推荐指数
5
解决办法
10万
查看次数

AngularJS中的ScrollTo函数

我正在努力让快速导航正常工作.它浮在一边.当他们点击链接时,会将他们带到页面上的该ID.我正在关注Treehouse的这个指南.这就是我对滚动的看法:

$("#quickNav a").click(function(){
    var quickNavId = $(this).attr("href");
    $("html, body").animate({scrollTop: $(location).offset().top}, "slow");
    return false;
});
Run Code Online (Sandbox Code Playgroud)

我最初放在它之前</body>.但是我似乎遇到了一个竞争条件,那就是在quickNav编译之前触发它(它有一个ng-hide放置它,不确定是否导致它 - 但它在DOM内).

如果我在控制台中运行该代码块,则滚动按预期工作.

我认为将它移入控制器更有效 - 或者更有可能在指令中.但我没有幸运完成那件事.如何让这块代码与AngularJS一起使用?

javascript anchor jquery scroll angularjs

69
推荐指数
4
解决办法
14万
查看次数

使用jquery单击来处理锚点onClick()

我在for循环中有一组动态生成的锚标记,如下所示:

<div id = "solTitle"> <a href = "#"  id = "' + tagId + '" onClick = "openSolution();"> ' + solTitle + '</a></div> <br>';
Run Code Online (Sandbox Code Playgroud)

执行此代码后,其中一个案例的html输出将如下所示:

<div id = "solTitle"> <a href = "#"  id = "solution0" onClick = "openSolution();">Solution0 </a></div> <br>

<div id = "solTitle"> <a href = "#"  id = "solution1" onClick = "openSolution();">Solution1 </a></div> <br>
Run Code Online (Sandbox Code Playgroud)

现在我希望在点击上面的链接时显示不同的文本.openSolution()看起来像这样:

function openSolution() {
    alert('here');
    $('#solTitle a').click(function(evt) {
        evt.preventDefault();
        alert('here in');
        var divId = 'summary' + $(this).attr('id');

        document.getElementById(divId).className = '';

    });
} …
Run Code Online (Sandbox Code Playgroud)

javascript anchor jquery click

67
推荐指数
3
解决办法
39万
查看次数

标签 统计

anchor ×10

html ×4

javascript ×4

jquery ×3

scroll ×3

angularjs ×2

css ×2

hyperlink ×2

onclick ×2

click ×1

css3 ×1

href ×1

transition ×1

urlencode ×1