jQuery html函数不适用于对象作为参数

Question

In my application the html for picture is saved in itemConfig.picture

If I add the following code to js:

$('.picture').html(itemConfig.picture);

The div with class picture remains empty. But this one works:

var tmpVar='<div class="field field-name-field-picture field-type-image field-label-hidden"><div class="field-items"><div class="field-item even"><img typeof="foaf:Image" src="http://localhost/ae/sites/default/files/DSC_02911_0.jpg" width="130" height="120" alt="" /></div></div></div>'
$('.picture').html(tmpVar);

These info would be useful:

alert(typeof itemConfig.picture); // returns "String"
alert(itemConfig.picture); // returns <div class="field field-name-field-picture field-type-image field-label-hidden"><div class="field-items"><div class="field-item even"><img typeof="foaf:Image" src="http://localhost/ae/sites/default/files/DSC_02911_0.jpg" width="130" height="120" alt="" /></div></div></div>

Why passing object property doesn't work?

Answer 1

我认为这对您有用，但这只是一个猜测。

$('.picture').html(itemConfig.picture.toString());

Answer 2

You should not need .toString() as you can see in this Fiddle .

var itemConfig = {};
itemConfig.picture = "<div style='width: 20px; height: 20px; background-color: red'></div>";

$('#start').on('click', function () {
    $('#type').html(typeof itemConfig.picture);
    $('#length').html($('.picture').length);
    $('.picture').html(itemConfig.picture);
});

The assumptions of the comments seem to be correct. You either don't have an element with the class picture in the dom ( picture.length = 0 ) at this very moment or the the value of itemConfig.picture is something else.