ошибка при динамическом изменении фонового URL / изображения src

#javascript #jquery #css

#javascript #jquery #css

Вопрос:

Я изменяюсь background:url('image-file') or img's src динамически, и все происходит так, как я ожидал, но у меня возникает одна проблема, когда в файле есть пробел между именем, например file name.gif (Not loading) or file-name.gif (load successfully)

   var file-src = ../context/image file.jpg  /*not changing */
              /* ../context/image-file.jpg : changes   */

 if(this.is('img')){   /* 'this' is selecter */
    this.attr('src', file_src);
    }else{
    this.css('background','url('  file_src  ')');
    }
  

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

Ответ №1:

Вы должны заключить имя файла в кавычки. Ваш код должен быть изменен на:

 var file-src = '../context/image file.jpg';

this.css('background',"url('"  file_src   "')");
  

Комментарии:

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

Ответ №2:

В URL-адресах не может быть пробелов. Пробел должен быть представлен символом . Вы можете использовать функцию encodeURI для правильного кодирования специальных символов.

Ваш javascript также выглядит некорректно, поскольку строки должны быть заключены в кавычки, но я предполагаю, что это просто ярлык, который вы использовали при публикации.

Комментарии:

1. спасибо jfriend00, я только что привел строку в кавычки, и теперь она работает для всех типов, но вы дали мне другую идею, чтобы избежать такой проблемы. Спасибо.