当文本溢出时使JQuery选框_Jquery_Html_Css_Overflow_Marquee

当文本溢出时使JQuery选框

jquery html css

当文本溢出时使JQuery选框,jquery,html,css,overflow,marquee,Jquery,Html,Css,Overflow,Marquee,我正在尝试制作一个Jquery脚本，如果文本溢出到#boxdiv之外，它将在文本周围放置字幕标记。文本明显大于30px，div确实隐藏了大部分文本。我的问题是字幕效果没有出现。这是我的全部代码： <!doctype html> <html> <head> <meta charset="utf-8"> <title>Untitled Document</title> <style> #box { width

我正在尝试制作一个Jquery脚本，如果文本溢出到

#box

div之外，它将在文本周围放置字幕标记。文本明显大于30px，div确实隐藏了大部分文本。我的问题是字幕效果没有出现。这是我的全部代码：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
#box {
    width:30px;
    overflow:hidden;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
</head>

<body>

<div id="box">
Overflooooooooooow
</div>

<script>

$(function(){
  $box = $('#box');
  $box.children().each(function(){
    if ($box.width() < $(this).width()) {
      $(this).wrap('<marquee>');
    }
  });
});
</script>
</body>
</html>


无标题文件
#盒子{
宽度：30px；
溢出：隐藏；
}
溢出
$（函数（）{
$box=$（“#box”）；
$box.children（）.each（函数（））{
如果（$box.width（）<$（this.width（））{
$（此）.wrap（“”）；
}
});
});

谢谢你的帮助。非常感谢所有帮助。

div中的文本只是一个文本节点，而不是一个可以获得宽度的元素。只需添加一个内部块元素：

<div id="box">
   <div>Overflooooooooooow</div>
</div>


溢出

编辑：

很抱歉，无法使用内部div，因为默认情况下它会继承父级宽度。使用跨度：

<div id="box">
   <span>Overflooooooooooow</span>
</div>


溢出

“请注意，与大多数jQuery方法一样，.children（）不返回文本节点；要获取所有子节点，包括文本和注释节点，请使用.contents（）。”是。。。我几乎要发布一个答案了，但后来你更正了。div不工作，因为它是一个

显示：block

。Span，默认情况下它是一个

显示：inline

。如果将内部div设置为

display:inline

，它也可以工作。