Question

基本上，我有类似的东西：

<h2 class="clickable">Hello</h2>

我想让它可点击。我知道这是一个奇怪的问题，因为我可以在那里插入一个a标签，但这就是我现在需要做的。我该怎么做？它有点像下面的代码吗？我有点失落。

$(".clickable").click(function(){
     window.location=$(this).attr("href");
     return false;
});

Answer 1

您的代码存在的问题是，h2 属性为href。

如果您要为其添加href属性，那么它可以正常工作;如this JS Fiddle所示。

显然，非标准href上的h2属性;您可能希望至少符合HTML5标准，并将url添加到data-属性中;

<h2 class="clickable" data-url="http://www.google.co.uk">Click Me</h2>

然后，您可以使用data()方法检索它;

$(".clickable").click(function(){
     window.location=$(this).data("url");
     return false;
});

可以找到这个小提琴here。

Answer 2

您需要有一个目标网址（您在href中引用的内容）。 HTML5中的正确方法是数据属性。

这是HTML5：

<h2 data-href="http://google.com/">My heading</h2>

这是JS：

$(".clickable").click(function(){
     window.location=$(this).data("href");
     return false;
});

如果您希望在新窗口中打开新链接，请使用以下代码：

$(".clickable").click(function(){
     window.open($(this).data("href"), 'new_window');
     return false;
});

Answer 3

试试这个

$(".clickable").click(function(){
     window.location.replace("http://stackoverflow.com");
});

放置您的路径而不是stackoverflow.com

Answer 4

是的，它有点像你编写的代码，但$(this).attr("href")引用H2的HREF，它没有HREF。另外，不要忘记准备好文档，否则它可能无法正常工作。

下面的代码会在H2标签的父代中找到一个HREF，然后转到该网址。

$(function(){
    $(".clickable").click(function(){
         window.location=$(this).parent().find("a").attr("href");
         return false;
    });
});

Answer 5

您可以使用锚标记包装<h2>元素的文本。

$('.clickable').wrapInner('<a href="..." />');

使h2可点击

5 个答案: