Проблема JavaScript при установке src для элемента img в FireFox - ошибка разбора строки? - PullRequest
Новая
       31

Проблема JavaScript при установке src для элемента img в FireFox - ошибка разбора строки?

0 голосов
/ 19 мая 2010

У меня проблемы с изображениями на странице. Я использую Javascript для создания элементов, и в FireFox кажется, что строка, которую я использую для установки innerHTML, не анализируется правильно. Я увижу это, когда на страницу сервера будут запрошены недопустимые переменные GET. Они выглядят так (из обработчика ошибок PHP-скрипта): 

GET[] = Array
(
  [shrink] => true
  [file_id] => \'   file_id   \'
  [refresh] => \'   now.getTime()   \'
)

Это происходит только для 5% запросов, что затрудняет решение. Я смог воспроизвести это сам в FireFox, и Firebug покажет, что URL-адрес, который он пытается получить: https://www.domain.com/secure/%27%20+%20image_src%20+%20%27

Я где-то читал, что это может быть связано с содержимым предварительной выборки FireFox (сейчас я не могу найти его в Google), поскольку, похоже, это происходит только в FireFox. Отключение предварительной выборки в about: config действительно предотвращает возникновение проблемы, но я ищу другое решение или обходной путь, который не требует от конечных пользователей изменения их конфигураций.

Вот специфика и код: У меня есть пустая ячейка таблицы на странице HTML. В функции JQuery $ (document) .ready () для страницы я использовал метод $ .ajax () JQuery, чтобы получить от сервера некоторые данные о том, что должно быть в этой ячейке. Он возвращает переменную file_id, которую для простоты я только что установил ниже. Затем он устанавливает пустую ячейку таблицы, чтобы иметь изображение с src, которое указывает на страницу, которая будет обслуживать файл изображения, в зависимости от того, какой file_id передан. Эта часть кода изначально была JQuery, поэтому я изменил ее на прямой Javascript, но это ничего не помогло. 

//get data about image from server
//this is actually done through JQuery's $.ajax() but you get the idea
var file_id = 12;

//create the src for the img
//the refresh is to prevent the image from being cached ever, since the page's
//javascript will be it changes
//during the course of the page's life
var now = new Date();
var image_src = 'serve_image.php?shrink=true&file_id=' + file_id + '&refresh=' + now.getTime();

//create 
document.getElementById('image_cell').innerHTML =
    '<A target="_blank" href="serve_image.php?file_id=' + file_id + '">' +
        '<IMG id=image_element src="' + image_src + '" alt="Loading...">' + 
    '</A>';`

Любая помощь будет принята с благодарностью. Спасибо!

Ответы [ 2 ]

1 голос
/ 19 мая 2010

Вместо изменения document.getElementById("image_cell").innerHTML, попробуйте дать идентификатор и выполните 

document.getElementById('a_tag_id_here').href = 'serve_image.php?file_id=' + file_id;
document.getElementById('image_element').src = image_src;

Если вы не можете установить идентификатор тега привязки, есть другие функции DOM, к которым легко добраться. Дело в том, что я думаю, что изменение innerHTML является источником вашей проблемы.

0 голосов
/ 19 мая 2010

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

var image_src = 'serve_image.php?shrink=true&file_id=' + file_id + '&refresh=' + now.getTime();

действительно трактуется так: 

var image_src = "'serve_image.php?shrink=true&file_id=' + file_id + '&refresh=' + now.getTime()";

Ваш JavaScript генерируется PHP или он находится в отдельном файле? Если вы выводите встроенный JavaScript-код, возможно, вы захотите поместить его в отдельный файл * .js, чтобы уменьшить вероятность того, что обработка кавычек PHP не мешает кавычкам JavaScript.

Надеюсь, это поможет!

...