javascript - 调整@bazmegakapa 的省略号脚本以供内联使用

Question

所以，

我正在努力调整@bazmegakapa 的脚本(解释为 here )以使用内嵌标签工作:

<script type="javascript">
var p=$('#fos p');
var divh=$('#fos').height();
while ($(p).outerHeight()>divh) {
$(p).text(function (index, text) {
    return text.replace(/\W*\s(\S)*$/, '...');
});
}
</script>

代码(我在 JsFiddle 中注释掉的代码)在放入标签之前效果很好。关于可能导致故障的任何想法？我认为 @bazmegakapa 的脚本很棒，主要是因为它比其他省略号插件更短且更易于管理，我很想弄清楚如何克服这个障碍并在我的元素中实际实现它。我仍然是一个 javascript 新手，所以来自 SO 的人的帮助会很棒。

-Marcatectura

Answer 1

除非我遗漏了什么，否则我几乎可以肯定这是因为您期望事情在 fiddle 中完成。您当前要运行 fiddle 的 Javascript onLoad ，这意味着 DOM 将在此时准备就绪。对于内联 Javascript，您将其打印在目标元素的上方 HTML 中。 HTML 是从上到下解析的，因此脚本在元素已知之前运行。当您尝试操纵尚不“存在”的事物时，它不会起作用。因此，您要么需要将您的内联脚本放在下方您的主要 HTML，要么使用类似的东西:

$(document).ready(function () {
    // Your code here
});

页面上的任意位置。

它可能有助于检查浏览器的控制台，但在您的情况下事情可能不会失败，因为如果找不到元素，jQuery 不会爆炸 - 它只会返回正确的东西，比如可能未定义，所以你的其他逻辑可能会失败......只是不是炸弹。如果你尝试 Javascript 会爆炸 document.getElementById("asdf").value如果没有带 id 的元素“asdf”的。但如果你使用 $("#asdf").val() 就不会爆炸- 它只会返回 undefined 或其他东西。

快速说明:您不需要包装 p喜欢$(p) - 它已经是一个 jQuery 对象，因此您可以在普通 p 上调用 jQuery 方法.

更新:

问题似乎出在<script>标签需要具有“text/javascript”类型，而不仅仅是“javascript”。这是包含您的工作代码的 fiddle :

http://jsfiddle.net/Z47CX/3/