Как видно из названия, у меня возникли проблемы с изменением фонового изображения элемента css элемента div для указания на локальный файл с помощью JS или JQuery в приложении Electron, которое я создаю.
Приложение представляет собой средство просмотра изображений, которое позволяет загружать файлы в каталог appData приложения на windows и затем отображать эти файлы. Однако я не могу изменить фоновое изображение, чтобы оно указывало на изображения в этом каталоге правильно.
Поскольку ниже переменная сообщения устанавливается в другом месте кода, в основном, с помощью функции пути в nodejs. Код, который у меня есть, выглядит следующим образом:
document.getElementById('bg').style.backgroundImage = "url("+message+")";
console.log(message);
Вывод на консоль:
file:///C:\Users\me\AppData\Roaming\display\files\pirate-flag.jpg
GET file:///C:/UsersmeppDataRoamingdisplay%0Filespirate-flag.jpg net::ERR_FILE_NOT_FOUND
Я также пробовал несколько вариантов:
message = message.replace(/\\/,'\\\\');
лучшее, что я получаю, это то, что первое «\» после C: становится двойным «\», но в сообщении об ошибке оно возвращается к «/». Я также попытался изменить фоновое изображение, используя jquery, но та же самая проблема. Я также пытался использовать escape(message); перед добавлением file:///, и это просто все испортило.
Если я установил путь явно в css, он работает нормально - как:
background-image: url("file:///C:\\Users\\me\\AppData\\Roaming\\display\\files\\pirate-flag.jpg")
Но я не могу делать это постоянно, так как изображение должно меняться в зависимости от того, что пользователь нажимает. Я просмотрел все, но не могу найти, как заставить это работать. Любые предложения?
РЕДАКТИРОВАТЬ:
Я понял, что вывод журнала также может быть отформатирован, так что это то, что отображается в инспекторе элементов после изменения css :
url("file:///C:Usersme\a ppDataRoamingdisplay\f ilespirate-flag.jpg")