Не принимает id переменная [закрыт]

#javascript #jquery

        
             
                
                    
                        
                            Закрыт. Этот вопрос не по теме. Ответы на него в данный
момент не принимаются.
                            
                        
                    
                
                            
                                
                
                        
                            
                        
                    
                        
                            Хотите улучшить этот вопрос? Переформулируйте вопрос,
чтобы он соответствовал тематике «Stack Overflow на русском».
                        
                        Закрыт 4 года назад.
                                                                                
           
                
        
Не принимает id переменная. 
Есть код, который при нажатии на объект(в моем случае я нажимаю на  изображения)
получает id этого объекта:

var id;
    document.querySelector('#rm').addEventListener('click', function(e){ // Вешаем
обработчик клика на UL, не LI
     id = e.target.id; // Получили ID, т.к. в e.target содержится элемент по которому
кликнули
    });


И мне нужно полученное id поместить в переменную, чтобы через нее получить адрес
изображения. Я делаю это так :

var a = document.getElementById(id);//получаю доступ к его свойствам
var canvas = document.getElementById('canvas_picker').getContext('2d');

// create an image object and get it’s source
var img = new Image();
img.src = a.src; // помещаю адрес картинки. Тут у меня и не работает!!! 

// copy the image to the canvas
$(img).load(function(){
  canvas.drawImage(img,0,0);
});


Весь код,  который при клике на любой участок  изображение можно получить код цвета
в HEX и RGB:

var canvas = document.getElementById('canvas_picker').getContext('2d');

    // create an image object and get it’s source
    var img = new Image();
    img.src = a.src; // помещаю адрес картинки. Тут у меня и не работает!!!

    // copy the image to the canvas
    $(img).load(function(){
      canvas.drawImage(img,0,0);
    });

    // http://www.javascripter.net/faq/rgbtohex.htm
    function rgbToHex(R,G,B) {return toHex(R)+toHex(G)+toHex(B)}
    function toHex(n) {
      n = parseInt(n,10);
      if (isNaN(n)) return '00';
      n = Math.max(0,Math.min(n,255));
      return '0123456789ABCDEF'.charAt((n-n%16)/16)  + '0123456789ABCDEF'.charAt(n%16);
    }
    $('#canvas_picker').click(function(event){
      // getting user coordinates
      var x = event.pageX - this.offsetLeft;
      var y = event.pageY - this.offsetTop;
      // getting image data and RGB values
      var img_data = canvas.getImageData(x, y, 1, 1).data;
      var R = img_data[0];
      var G = img_data[1];
      var B = img_data[2];  var rgb = R + ',' + G + ',' + B;
      // convert RGB to HEX
      var hex = rgbToHex(R,G,B);
      // making the color the value of the input
      $('#rgb input').val(rgb);
      $('#hex input').val('#' + hex);
    });

    

Ответы

Ответ 1

Из приведённых фрагментов кода не совсем понятно, какая часть из них находится внутри
обработчика событий кликов по изображениям (или вы действительно только меняете id?).
У меня ваш код работает в таком виде:

var id, img, a,
canvas = document.getElementById('canvas_picker').getContext('2d');

document.querySelector('#rm').addEventListener('click', function(e) {
     id = e.target.id; 
     a = document.getElementById(id);
     img = new Image();
     $(img).load(function(){
            canvas.drawImage(img,0,0);
     });
     img.src = a.src;
    });


https://jsfiddle.net/du5ns2ug/