Question

我有一个返回图像的XHR响应。我有我的功能，以显示图像。我将JQuery和JS结合在同一个代码片段中。到目前为止一切运作良好：

function resultat(o){  
          var leselements = o.query.results.bossresponse.images.results.result;
          var output = '';  
          var no_items = leselements.length;  
          for(var i=0;i<no_items;i++){  
            var lien = leselements[i].url;

            //place image urls in img src  
            output += "<img src='" + lien + "' class='imgs'>";  
          }  
          // Place images in div tag  
          document.getElementById('results').innerHTML = output;}

但我希望允许用户点击图片，然后使用点击的图片src填充输入字段（＆＃39;＃imageurl＆＃39;）。这是我尝试的但它不起作用。

$('.imgs img').click(function(){
            $('#imageurl').val() = "";
            var source = $(this).attr('src');
            $('#imageurl').val() = source;    
          });

任何帮助将不胜感激。 TIA。

Answer 1

以这种方式使用.val（）只会返回#imageurl的当前值。

$('#imageurl').val()

.val是一个函数调用，可用作getter和setter。

要设置值，请尝试以下操作：

$('#imageurl').val(source);

Answer 2

$('#imageurl').val("");
// ...
$('#imageurl').val(source);

请参阅the documentation。

Answer 3

试试这个：

$('img.imgs').click(function(){
   var src = $(this).attr('src');
   $('#imageurl').val(src);  
});

如果在附加事件处理程序后渲染图像，请使用：

$('img.imgs').live('click', function(){
   var src = $(this).attr('src');
   $('#imageurl').val(src);  
});

Answer 4

谢谢你们的快速回答。我尝试了所有这些，但他们没有为我工作。然后我问了一位朋友，我们终于找到了一种让它成功的方法。可能不是最好的或专业的方式，但它的工作原理。如果有人需要，这是解决方案。

function resultat(o){  
          var leselements = o.query.results.bossresponse.images.results.result;
          var output = '';  
          var no_items = leselements.length;  
          for(var i=0;i<no_items;i++){  
            var link = leselements[i].url;

//Place urls in image src and pass in 'link' parameter to the getsrc function 
            output += "<img src='" + link + "' onclick='getsrc(\""+link+"\")'>";  
          }  
          // Place images in div tag  
          document.getElementById('results').innerHTML = output;


        }

         function getsrc (link) {
            //console.log($(this));
            $('#imageurl').val("");
           // var source = $(this).attr('src');
            //place imageurl value by passing in the link parameter. 
            $('#imageurl').val(link);

          }

使用javascript中的图像src填充输入字段

4 个答案: