使用 jQuery 截断链接

Posted

技术标签:

【中文标题】使用 jQuery 截断链接【英文标题】:truncate links with jQuery 【发布时间】:2012-02-08 14:56:23 【问题描述】:

我在这里的第一篇文章,但通过潜伏我已经学到了很多 =) 这一次,我找不到问题的解决方案,尽管它看起来很容易实现。

我有一个博客文章的链接列表,由 Feed2JS 生成。不幸的是,作为此源的 RSS 提要向我不想要的链接添加了锚点。我无法更改提要,因为它是在 RapidWeaver 中自动生成的。

是否可以使用 jQuery 从 url 中的哈希中删除所有内容?例如:改变

http://www.example.com/blog/files/398e042ea42b7ee9d1678b3c53132fc3-31.php#unique-entry-id-31

http://www.example.com/blog/files/398e042ea42b7ee9d1678b3c53132fc3-31.php

我对 jQuery 很陌生,还有很多东西要学,所以请保持简单的回答。

杰伦

【问题讨论】:

【参考方案1】:

如果你只是想截断网址,你可以这样做

var url = "http://www.example.com/blog/files/398e042ea42b7ee9d1678b3c53132fc3-31.php#unique-entry-id-31";
var index = url.indexOf('#') != -1 ? url.indexOf('#') : url.length
alert(url.substring(0,index));

输出:

http://www.example.com/blog/files/398e042ea42b7ee9d1678b3c53132fc3-31.php

示例:http://jsfiddle.net/2dXXx/

【讨论】:

【参考方案2】:

您不需要 jQuery 来执行此操作,因为 javascript 通过 window.location 支持它。

看看这个答案,了解你想要做什么javascript window location href without hash?。

【讨论】:

【参考方案3】:

我喜欢这样做:

var a = document.createElement("a");
a.href = "http://www.example.com/blog/files/398e042ea42b7ee9d1678b3c53132fc3-31.php#unique-entry-id-31";
alert(a.protocol + "://" +  a.host + a.pathname + a.search);

http://jsfiddle.net/karim79/7pMbk/1

【讨论】:

去掉用户名和密码【参考方案4】:

当然你可以这样做:

var str = 'http://www.example.com/blog/files/398e042ea42b7ee9d1678b3c53132fc3-31.php#unique-entry-id-31';
var substr = str.split('#');
// substr[0] contains "http://www.example.com/blog/files/398e042ea42b7ee9d1678b3c53132fc3-31.php"
// substr[1] contains "unique-entry-id-31"

请注意,这是来自 JavaScript API。

【讨论】:

谢谢大家,非常感谢!【参考方案5】:

你不需要为此使用 jQuery:

function truncate(href) 
  var a = document.createElement('a');
  a.setAttribute('href', href);

  a.hash = '';
  return a.href;

【讨论】:

【参考方案6】:

不需要对 jQuery 的依赖,您可以使用正则表达式,如 jsFiddle 所示

var url = "http://www.example.com/blog/files/398e042ea42b7ee9d1678b3c53132fc3-31.php#unique-entry-id-31"
console.log("base url >> " + url)    
var matcher = /(.*)#.*/.exec(url)
var truncated = matcher[1]
console.log("truncated url >> " + truncated)    

【讨论】:

【参考方案7】:
var url = "http://www.example.com/blog/files/398e042ea42b7ee9d1678b3c53132fc3-31.phpunique-entry-id-31";

alert(url.substring(0,url.indexOf('#'))); // will give you empty string if you dont have # in the url.

所以,你可以使用

alert(url.split('#')[0]);

【讨论】:

以上是关于使用 jQuery 截断链接的主要内容,如果未能解决你的问题,请参考以下文章

基于宽度截断文本的jQuery插件

JQuery:在 4 个字符后截断 div 文本

数据表 - 单元格字符串截断

截断使用 show less /more 选项绑定的多行 HTML

单击“阅读更多”链接时截断并显示或隐藏链接文本

如何修复 select2 的占位符在文档准备好时被截断?