jquery заменить строку из html () - PullRequest
Новая
       9

jquery заменить строку из html ()

1 голос
/ 01 марта 2012

Я пытаюсь заменить стиль CSS в следующем коде: 

var theHTML = this.html();
theHTML.replace("style=\"display:none;\"", "style=\"display:inline;\"");
alert(theHTML);

HTML выглядит так: 

<IMG SRC="picturesFromServer.asp?PhotoId=365481" style="display:none;">

Однако, как только я проверил, изменилось ли оно или нет, он продолжает отображать ничего вместо встроенного. Я просто пытаюсь сделать это видимым, прежде чем напечатать его.

Ответы [ 5 ]

6 голосов
/ 01 марта 2012

Вы можете использовать метод JQuery .css(): 

$("img").css("display","inline");
1 голос
/ 01 марта 2012

Я действительно не мастер jQuery, но в Javascript неизменяемы ли строки?Если вы попробуете что-то вроде 

theHtml = theHtml.replace(...)
1 голос
/ 01 марта 2012

РЕДАКТИРОВАТЬ: Если то, что вы пытаетесь сделать, это получить тег img внутри this и добавить его куда-нибудь еще, с помощью display:none; сделайте это.

http://jsfiddle.net/tL3Uf/

HTML 

​<div id="mainContainer">
    <img src="http://imgh.us/business-online.jpg" style="display:none;" /> </div>

​<div id="destination"></div>​​​​​​​​​​​​​​​​​​

Javascript 

​$(function(){
    var $img = $("#mainContainer img").clone();
    $img.show(0).appendTo('#destination');
});​

CSS 

#incase image doesnt load

img{
  padding: 10px;
  background: #f00;        
}​
0 голосов
/ 01 марта 2012

Строка .replace() method не обновляет строку, по которой вы ее вызываете, она возвращает новую строку - поэтому ваш alert(theHTML) продолжает отображать исходную строку. Если вы сказали это: 

theHTML = theHTML.replace("style=\"display:none;\"", "style=\"display:inline;\"")

Тогда alert(theHTML) покажет замененную версию.

Тем не менее, это по-прежнему не повлияет на фактический элемент img, потому что это всего лишь манипулирование строковой переменной, которая не имеет связи с вашим элементом. Чтобы на самом деле сделать элемент img видимым, вам нужно заменить его новым элементом, сгенерированным из вашей строки, что создает трудности, или вы можете просто установить свойство display напрямую: 

$(this).css("display", "inline");

Также обратите внимание, что ваш исходный код сказал this.html() - кажется маловероятным, что this будет объектом jQuery, для которого вы можете вызвать метод jQuery .html(), это скорее всего сам элемент DOM, в котором на случай, если вам нужно будет сказать $(this).html(). Поэтому, если какой-либо из ответов не работает, это может быть связано с тем, как вы в первую очередь получаете ссылку this на элемент img - может быть полезно, если вы обновите свой вопрос, чтобы показать это.

Обратите также внимание, что если идея заключается в том, чтобы элемент img появлялся в печатном виде, но не иначе, вы можете сделать это с помощью CSS: 

@media all {
   img.printOnly { display: none; }
}
@media print {
   img.printOnly { display: inline; }
}

Предоставьте класс "printOnly" (или любое другое имя класса, которое вы хотите использовать) любым элементам, которые должны отображаться только для печати. Или укажите по идентификатору. Безотносительно.

0 голосов
/ 01 марта 2012

заменить первые две строки данного кода на эту строку: 

$(this).find("img").css("display","inline");
...