Изменить расширение изображения по умолчанию в javascript

Question

У меня есть страница на моем сайте, отображающая изображения. Когда я нажимаю правой кнопкой мыши на изображении и нажимаю Save Image As, я получаю как имя по умолчанию. Я хочу изменить имя изображения правой кнопкой мыши и сохранить его.

Это, например:
В моем HTML коде есть
image src="abc.jpeg"

Когда я правая кнопка мыши, я хочу, чтобы это изображение, которое будет сохранен как def.jpg.

Есть ли способ сделать это?

Answer 1

Вы помещаете это в образе

<img src=".." onClick="this.src='new URL'"> 

или вы можете сделать это в отдельной функции

<img src=".." onClick="change(this)"> 
// 
<script> 
function change(img) { 
img.src = 'new src'; 
} 
</script> 

Answer 2

Насколько я знаю, вы не можете сделать это с помощью JavaScript. Это то, что можно обрабатывать только на стороне сервера .

Если вы используете PHP, простым решением было бы использовать header().

// It will be called downloaded.pdf 
header('Content-Disposition: attachment; filename="downloaded.pdf"'); 

Вы можете заменить download.pdf переменной, конечно.

header('Content-Disposition: attachment; filename="' . $fileName .'"'); 

Из PHP документации:

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

Answer 3

Не делайте этого, не каждый браузер поддерживает его (в некоторых случаях также возможен отказ в событиях контекстного меню). Зачем вам это делать?

Я думаю, вы хотите установить ссылку на большие версии ваших миниатюр. Поэтому просто поместите ссылку (<a>) вокруг ваших тегов изображений, и все будут счастливы. Когда вы укажете ссылку с описательной всплывающей подсказкой, это будет еще лучше.

---

EDIT:

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

Браузер, скорее всего, будет использовать имя файла из пути загрузки. Динамик src нельзя изменять динамически (по сценарию), потому что это приведет к загрузке другого файла. Что вы можете сделать, так это доставить страницу с файлами, уже находящимися под их именами желаемого файла, но это нужно сделать на сервере.

Так что опция №2 запускает (новый) файл. В заголовке Content-Disposition вы можете динамически (на сервере) предлагать любое имя файла для отправленного контента.Для начала загрузки просто добавьте изображение в ссылку (из которой вы даже можете изменить атрибут href). Или вы можете создать настраиваемое контекстное меню, чтобы отобразить ссылку для загрузки в качестве кнопки [Сохранить как] (как это сделать, это вопрос другого вопроса).

Вариант № 3 заключается в том, чтобы открыть файл в новой вкладке/окне, применить на нем document.execCommand("SaveAs", [...]) и снова закрыть вкладку/окно. К сожалению, это поддерживается только в Internet Explorer; см. Does execCommand SaveAs work in Firefox? за это и предложения.

Answer 4

Хорошо, есть способ сделать это .. но я не уверен, что он работает с большинством браузеров. Добавить oncontextmenu="return false;" атрибут в теге тела. Он отключит контекстное меню (надеюсь,?!)!

И если вы хотите настраивать контекстное меню, сделайте это с небольшим количеством css и скриптом. Прикрепите обработчик событий для события click и выполните действие при появлении левого или правого щелчка.