如何使用jQuery在标题属性中添加换行符

4
请看下面的代码,它在我的调查引擎中为字段添加了鼠标悬停事件的工具提示。 我想实现的是在工具提示中添加换行符。 非常感谢您的帮助。
var $j = jQuery.noConflict();

$j('#choice31QID405').mouseover(function() { 
$j(this).attr('title','My name is Glenn. <Add a line break>. I am a good boy'. <Add a line break>. I live in New Delhi); 
})

$j('#choice31QID405').mouseout(function() { 
$j(this).removeAttr('title'); 
})

3
可能是 如何在 HTML 工具提示中使用回车符? 的重复问题。 - Anupam
不是重复的。我正在使用jQuery执行这个操作。 - Glenn
如果你浏览了那篇帖子中的所有解决方案,你会在那里找到javascript的解决方案。不管怎样,方法是相同的。 - Anupam
3个回答

8
在现代浏览器中,您只需使用换行符即可:

$("#target").attr("title", "Hello\nWorld");
<p title="Hello
World">
This one is hardcoded in the HTML.
</p>
<p id="target">
This one is added later
</p>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

这在目前(撰写本文时)的Chrome、Firefox以及IE11上都可以正常工作。


4

使用实体代码&#010;来进行换行。你的代码将看起来像这样:

$j(this).attr('title','我的名字是格伦。&#010;我是个好孩子。&#010;我住在新德里。');

请参考此链接


请详细说明您的问题。 - Vibhor Dube
1
在浏览器上, 出现在工具提示中。 - Glenn
你正在使用哪个浏览器?title属性的值是否正确地被引号包裹? - Vibhor Dube
我在 Firefox 上进行了测试。是的,它被包含在引号中。 - Glenn

0

在HTML中使用<Hr>标签来设置line

以下是工作示例:

   

 var $j = jQuery.noConflict();

    $j('#choice31QID405').mouseover(function() { 
    $j(this).attr('title','My name is Glenn. <hr />. I am a good boy <hr /> I live in New Delhi'); 
      $j('#test').html($j(this).attr('title'));
    });

    $j('#choice31QID405').mouseout(function() { 
    $j(this).removeAttr('title'); 
      $j('#test').html("");
    });
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
      <title>JS Bin</title>
    <body>
      <div id="choice31QID405">Mouse over here</div>
      <div id="test">Tooltip will show up here..</div>
    </body>


老兄,我无法在 HTML 中添加 ID。我正在调查平台上编程。HTML 是动态生成的。我无法控制它。 - Glenn

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接