Question

我想为我网页上的每种现有链接打开一个函数。

示例：

当我点击.pdf链接时，它会打开并显示pdf函数。如果单击.mp3链接则会打开播放器等

但我想要一种不用编辑链接的方法。

Answer 1

使用jQuery，您可以轻松地将处理程序附加到页面的所有链接。在该处理程序中，您可以测试href并采取适当的任何操作。如果您想阻止某些类型链接的默认链接导航，请为这些类型调用event.preventDefault()：

$(document).on("click","a", function(e) {
   if (/\.pdf$/i.test(this.href)) {
       pdfFunction();
   } else if (/\.mp3$/i.test(this.href)) {
       playMP3(this.href);
       e.preventDefault();
   } // etc.
});

我展示的代码使用委托事件模型，以便在文档级别附加一个处理程序，而不是为每个链接附加一个处理程序。如果您因某种原因需要每个链接一个处理程序，则可以执行$("a").on("click",...)或$("a").click(...)。

Answer 2

所以，这真的取决于你想要做什么。但是，这是我的基本建议......

假设您来自网页（假设您的链接是什么意思），您必须有办法触发它是什么类型的链接。很简单，您可以在不同类型的链接中添加一个类来标识它们是什么。你的HTML看起来像这样，或许：

<a href="http://path/to/file.mp3" class="mp3link">Some Song</a>
<a href="http://path/to/file.pdf" class="pdflink">Some PDF</a>
<a href="http://path/to/file2.pdf" class="pdflink">Some Other PDF</a>

现在，您想要触发链接类型。您如何实际处理发生的事情取决于您是否可以在客户端完成所有操作，或者您是否需要返回服务器以进行更多工作（同样，您必须决定要执行的操作）。您可以使用JavaScript（特别是jQuery库）来触发这些类。有点像...

$('.mp3link').on('click', function(e) {
  e.preventDefault(); // stop the link from being clicked

  // Define what you want to do here - ajax call back to the server or fire
  // up a client-side media player, or whatever.
});

$('.pdflink').on('click', function(e) {
  e.preventDefault(); // stop the link from being clicked

  // Define what you want to do here.
});

...等等，无论你有什么类型的互动和文件。现在，没有更多信息，我无法了解更多细节，但如果您了解应用程序中的客户端/服务器交互，这应该为您提供一个如何完全连接它的良好起点。

根据链接定义功能

2 个答案: