0

我有一个工具提示，它在对象翻转时从其标题属性中获取信息并显示它。

我想显示三个不同的东西：姓名、地址和图像。由于只允许一个标题属性，我该如何实现？

我可以将其另存为，title="John, Address 55, image.jpg"但不知道如何将每条单独的信息（名称、地址、链接）与 jquery 一起使用。

如果有更好的解决方案，请提出建议。

4

4 回答 4

2

使用 HTML5 数据属性

HTML

<div data-name="John"
  data-location="Address 55"
  data-image="image.jpg">
</div>

JavaScript

var el = $('div')
el.data('name')
el.data('location')
el.data('image')
于 2012-09-01T12:56:29.810 回答
1

你可以试试这个

代码

<div>
    <div title="John,Address 55,image.jpg" class="facedata"> fdgfdsg
    </div>
</div>

JS代码

var s, arr=new Array();
s= $('.facedata').attr('title');
arr=s.split(",");
for(var a=0; a<arr.length;a++){
  console.log(arr[a]);
}

http://jsfiddle.net/hCMJ5/29/

于 2012-09-01T13:12:34.370 回答
0

工具提示之类的东西。

<a href="#" class="tooltip" title="name, address, image">tool tip</a>
<div id="tooltip-content">
    <span class="name field"></span>
    <span class="address field"></span>
    <span class="image field"></span>
</div>

<script type="text/javascript">

jQuery(document).ready( function (){ 
    jQuery(".tooltip").hover(function(){
        var str = jQuery(this).attr("title").split(",");
        jQuery.each(str, function(index, value){
            value = value.trim();
            jQuery(".field:eq("+index+")").text(value);
        });
        jQuery("#tooltip-content").fadeIn();
    }, function(){
        jQuery("#tooltip-content").fadeOut();
    });
});
</script>
于 2012-09-01T13:39:33.337 回答
0

把你的标题写成这样：

title='{"name":"John","age":"55","img":"image.jpg"}'

then use this is js code

var myString = $("#myObject").attr('title').
var obj = jQuery.parseJSON(myString);

alert(obj.name);
alert(obj.age);
alert(obj.img)

显然不要在实践中提醒用户，而是在您的自定义工具提示中使用这些值

于 2012-09-01T12:47:16.510 回答