Блог

Напишите функцию, которая будет вызываться при нажатии правой кнопки мыши на одном из изображений, которые у вас есть на сайте.
Функция вызывает окно подтверждения (), в котором вы спрашиваете пользователя, хочет ли он узнать источник изображения,
если пользователь нажимает OK alert (this.src ), в котором отображается содержимое атрибута src этого изображения
. Если пользователь нажимает «Отмена», отключите контекстное меню, котороепоявляется при нажатии правой кнопки

это мой неправильный код

 <img src="opera1.png" id="immagine1" alt="immagine1" width="500" height="333" oncontextmenu="destra()">
<img src="ioaparatissima.JPG" id="immagine2" alt="immagine2" width="500" height="333" oncontextmenu="destra()">
 

javascript

 function destra(){
  var r = confirm("Vuoi conoscere la src dell'immagine");

  if(r == true) {
    alert(y.src);
  } else {
  }
}

 

Поскольку вы используете встроенные привязки событий, я бы предложил два изменения.

oncontextmenu="destra(this)"

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

 function destra(y){
  var r = confirm("Vuoi conoscere la src dell'immagine");

  if(r == true) {
    alert(y.src);
  } else {
  }
}
 

Примите элемент в качестве аргумента метода.

Перечитывая ваше утверждение, мне кажется, что этот ответ соответствует лучше … (?)

 document.querySelectorAll('img').forEach(el=> el.addEventListener('contextmenu',destra) )
 
function destra(e)
  {
  e.preventDefault() // disable real context Menu

  if ( confirm("Vuoi conoscere la src dell'immagine") )
    {
    alert( this.src )
    }
  } 

 <img src="https://picsum.photos/150" alt="immagine1" >

<img src="https://picsum.photos/100" alt="immagine2" > 

Используйте getElementById() , как в этом примере:

 function destra() {
    let r = confirm("Vuoi conoscere la src dell'immagine?");
    let y = document.getElementById("immagine1");
    if (r == true) {
        alert(y.src);
    }
}
 

попробуйте вот так… Я надеюсь, что это полезно…

 <img src="opera1.png" id="img1" alt="immagine1" width="500" height="333">
<button onclick="getimgId(1)">copy link</button>
<br/>
<img src="ioaparatissima.JPG" id="img2" alt="immagine2" width="500" height="333">
<button onclick="getimgId(2)">copy link</button>

<script type="text/javascript">
    function getimgId(img_id){
        var res = confirm("Vuoi conoscere la src dell'immagine");

        if(res == true) {
            var img_id = img_id;
            var img_url = document.getElementById('img' img_id).src;
            alert(img_url);
        } else {

        }
    }
</script>
 

теперь вы хотите просто присвоить уникальный идентификатор изображениям и расположить правые боковые кнопки изображений…

например, img1, img2, img3 для изображений и onclick=»getimg(1)», getimg(2), getimg (3)…

вы можете легко назначить уникальные идентификаторы с помощью Javascript. просто примените цикл и внутри циклов добавьте изображения с уникальными идентификаторами…

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

 for(var i=0;i<yourRecordArray.length;i  ){
    newList = document.createElement('li');
    newList.className = 'list-border';
    newList.id = 'imgdiv' i;
    newList.innerHTML = '<img src="" id="img' i '"> 
                        '<button onclick="">';
    document.getElementById('add').appendChild(newList);
 

я решил так

 function destra(y) {

    window.addEventListener("contextmenu", function(e){e.preventDefault();}, false);

    var r = confirm("do you want to know the src of the image?");

  if(r == true) {
    alert(y.src);
  } else {

  }

} 

 <img src="https://picsum.photos/150" alt="immagine1"id="immagine1" alt="immagine1" width="150" height="150" oncontextmenu="destra(this)">
<img src="https://picsum.photos/150" alt="immagine2" id="immagine2" alt="immagine2" width="150" height="150" oncontextmenu="destra(this)">