Javascript Image тег

Я добавив снимок изображения веб-камеры в DIV с помощью JQuery (2.1.3)Javascript Image тег

Почему это не работает:

var image = new Image(); 
image.src = "data:image/jpg;base64," + data; 
image.width = "320px"; 
image.height = "240px"; 
$("#video").html(image);

Тег изображения имеет размеры 0 для w и h;

Это делает работу

var image = $("<img>", { 
    "src": "data:image/jpg;base64," + data, 
    "width": "640px", "height": "480px"}); 
$("#video").html(image);

источник

2015-01-09 Fenrir

'.html()' ожидает строку как ввод и вставляет эту строку, как если бы это был фрагмент html в dom в указанной точке. Вы не проходите в строке. Вы проходите объект Image, который НЕ будет работать. Как правило, jquery расширяет объект изображения с помощью метода .toString magic, который происходит, чтобы выплескивать html-представление объекта изображения. поэтому версия 1: объект изображения, а не работа. версия 2: объект jquery, работает. –

@MarcB nope, вы не можете ошибаться, 'html()' может обрабатывать элементы, текст и объект jquery, это не проблема, @Fenrir вы можете предоставить скрипту своего кода? – neo

@neo: http://api.jquery.com/html/#html-функция единственным приемлемым параметром является htmlstring ... no parameter = return .innerhtml. –

Вопрос заключается в том, что чистый HTML Image элемент принимает числа как его width и height, а не размеры, поэтому удалить "точек":

var image = new Image(); 
 
image.src = "https://www.google.co.uk/images/srpr/logo11w.png"; 
 
image.width = "320"; 
 
image.height = "240"; 
 
$("#video").html(image);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div id="video"></div>

JQuery умнее и преобразует width и height свойства style="width:320px; height:240px", то есть использование css, которое является предпочтительным как width и height, атрибуты устарели.

источник

2015-01-09 21:11:44 Rhumborl

Javascript Image тег

ответ

Смежные вопросы