写的“src”属性，当我点击一个图像

Question

我有这样的代码进行图片搜索槽谷歌图像API：

$(document).ready(function(){ 
     $('#envio').click(function(){ 
      var iURL = "http://ajax.googleapis.com/ajax/services/search/images"; 
      $.ajax({ 
       url: iURL, 
       type: 'GET', 
       dataType: 'jsonp', 
       data: { 
        v: '1.0', 
        q: $('#query').val(), 
        format: 'json', 
        jsoncallback: '?' 
       }, 
       success: function(data) { 
        console.log(data); 
        var html = ''; 
        var j = 1; 
        $.each(data.responseData.results, function(i, v) { 
         html += '<img id="' + j + '" src="' + v.tbUrl + '" title="' + v.title + '" alt="' + v.title + '"/>'; 
         j++; 
        }); 
        $('body').append(html); 
       }, 
       error: function(xhr, textStatus, error){ 
        console.log(xhr.statusText, textStatus, error); 
       } 
      });     
     }); 
    }); 

我有一个输入字段，并当我点击一个IMG的价值需要SRC属性去那里。我尝试用这个代码，但没有奏效：

$('img').click(function(){ 
    $.each(function(){ 
     $('#urlimagen').val($this.src); 
    }); 
}); 

而且默认情况下，第一个代码只返回4张图片，我需要四个以上，那么我解决这个问题的代码是如下：

1. 确实知道如何获得超过4张图片吗？
2. 任何可以帮助我解决图像代码？我的意思是当我点击图片时，SRC值必须在INPUT中调用#urlimagen。

Answer 1

我会改变你用来附加图片的代码，并确保你在那个时候分配了click事件句柄，而不是之前。

$.each(data.responseData.results, function(i, v) { 
    var $img = $('<img />'); // create a new image object 

    // change image attributes 
    $img.attr({ 
     'id': 'j', 
     'src': v.tbUrl, 
     'title': v.title, 
     'alt': v.title 
    }); 
    j++; 

    // append image to DOM, remove your append statement and leave this here 
    $('body').append($img); 

    $img.click(function() { 
     $('#urlimagen').val($(this).attr('src')); 
    }); 

}); 

对于4张图片返回，看着你的代码看起来它取决于data.responseData.results物体的长度，我不知道你是否可以修改退货数量。

Answer 2

$('img').click(function(){ 
     $('#urlimagen').val($(this).attr("src")); 
}); 

Answer 3

如果您的HTML看起来像这样：

<img src="..." class="clickableImage" /> 

..然后你可以使用这个JavaScript：

$('.clickableImage').click(function(){ 
    $('#urlimagen').val($(this).attr('src'); 
}); 

它会把点击图像的src属性到输入编号为urlimagen。

$('.clickableImage')选择器获取类名为clickableImage的所有元素。 .click向这些元素中的每一个添加了一个点击事件。在该功能中，$(this)将引用点击的图像。使用attr方法，您可以检索该点击图像的src属性，并使用val方法将其设置为表单输入的值。

如果您不能或不想添加班级名称，可以通过使用选择器$('img')使其适用于所有图像，但如果可能，我真的建议您使用班级名称，以便您可以控制涉及哪些图像。现在

，如果你想要的每个点击图像的价值是添加输入值，而不是取代它，而不是使用：

$('#urlimagen').val($('#urlimagen').val() + ($('#urlimagen').val() > 0 ? ',' : '') + $(this).attr('src'); 

每个图像单击将新项目添加到列表。

想要一个数组吗？使用html：

<form id="urlimages"></form> 

..使用脚本：

$('#urlimages').append('<input type="hidden" name="images[]" value="'+$(this).attr('src')+'" />'); 

在服务器端，POST将包含单击每个图像的数组。