如何使用 jQuery 将超链接文本用作变量？答案

【问题标题】：How do I use jQuery to use the hyperlink text as a variable?如何使用 jQuery 将超链接文本用作变量？
【发布时间】：2011-03-31 08:39:05
【问题描述】：

我有一个 jQuery 函数，它将用一个 jPlayer 替换每个超链接，并使用该超链接作为其源。超链接在 HTML 中如下所示：

<div>
<a href="demos/myfile.mp3" rel = 'jPlayer'>myfile</a>
</div>

所以到目前为止，我的 Javascript 中的内容是这样的：

$(document).ready(function() {   
  $('a[rel="jPlayer"]').jPlayer("setMedia", { mp3: $(this).attr("href") });
});

问题是我无法找出正确的选择器来获取现有超链接的值并将其用于代码中的 mp3: source。也许我什至没有使用 $this 权利，或者我错过了完全不同的东西。

当我按原样运行代码时，我在 Firebug 中得到“a.attributes is null”。谁能帮忙解决这个问题？

【问题讨论】：

在一些速度更快的移动浏览器中，因为它们将优化的数据发送到手机或设备，$(this) 存在一个问题，它必须重新加载页面。除非你真的必须，否则不要使用它。在这种情况下，您不需要它。下面的第一个答案是一个更好的解决方案。你甚至可以有 $('a[rel="jPlayer"]').click(function(){});并将点击的项目分配给一个变量。
还是有问题，我在上面的超简单 HTML 文件中尝试使用正确的脚本 srcs 但链接不会更改为播放器，它只是作为链接保留.我已经尝试了以下所有三个功能，它们不会抛出错误（所以我知道它们都按预期工作）但仍然有问题。也许我不能在超链接上使用它？
可能与您调用 js 文件的顺序有关...

标签： jquery variables attributes selector href

【解决方案1】：

问题在于你的脚本构造：

$('a[rel="jPlayer"]').jPlayer("setMedia", { mp3: $(this).attr("href") });

您将此引用到 jPlayer，而不是选定的值。你应该以其他方式使用它，试试这个：

$('a[rel="jPlayer"]').jPlayer("setMedia", { mp3: $('a[rel="jPlayer"]').attr("href") });

或屋檐

var anchor = $('a[rel="jPlayer"]');
anchor.jPlayer("setMedia", { mp3: anchor.attr("href") });

【讨论】：

这是最接近我的原始代码的，所以它对我来说最有意义，而且似乎和后面的答案一样好用，所以我会选择这个答案。不幸的是，我对这个 jPlayer 有其他问题，我想我会放弃它以支持更简单的接口。

【解决方案2】：

页面上可以有多个链接。要正确初始化每个 jPlayer 实例，您可以遍历所有链接并为每个匹配的元素初始化 jPlayer。

$(document).ready(function() {   
    $('a[rel="jPlayer"]').each(function(index){
        var link = $(this);
        link.jPlayer("setMedia", { mp3: link.attr("href") });
    }); 
});

【讨论】：

【解决方案3】：

如果this 不能以明显的方式工作，我会拔出选择器并重新使用它。

$(document).ready(function() {   
  var media_link = $('a[rel=jPlayer]');
  media_link.jPlayer("setMedia", { mp3: media_link.attr("href") });
});

这具有仅在锚元素上调用extend 一次而不是两次的双重效果。我通过删除引号稍微更改了选择器。

【讨论】：