如何在jquery中从img标签获取图像src?

时间:2014-12-11 10:14:18

标签: php jquery html

我试图以数组形式获取多个img src。我试图以阵列形式一次上传多个图像。

我的jquery -

$( "#file" ).change(function() {
    if (typeof FormData !== 'undefined') {
        // send the formData
       var formData = new FormData( $("#formname")[0] );
        $.ajax({
            url : 'http://localhost/JSG/blog/uploadimg',  // Controller URL
            type : 'POST',
            data : formData,
            async : false,
            cache : false,
            contentType : false,
            processData : false,
            success : function(data) {
                  response = jQuery.parseJSON(data);
                  var html = "";

                  $.each(response, function(key, value) {
                    html += "<img  style='width:150px;height:145px' id='test'  src='http://localhost/JSG/upload/"+value.file_name+"' class='img-thumbnail'>";

                html += "<input style='display:none' value='"+value.file_name+"' type='button'  class='imgstr' name='imgstr[]'>";
                         });


                  $('#img_t').append(html);                        


            }
        });

    } else {
       message("Your Browser Don't support FormData API! Use IE 10 or Above!");
    }
      });

当我在img标签下面使用输入标签时,显示错误。

控制台中的

错误 -

**Uncaught TypeError: Cannot read property 'length' of undefined**

HTML -

<img style="width:150px;height:145px" src="http://localhost/JSG/upload/roundicons34.png" class="img-thumbnail">
<img style="width:150px;height:145px" src="http://localhost/JSG/upload/roundicons34.png" class="img-thumbnail">
<img style="width:150px;height:145px" src="http://localhost/JSG/upload/roundicons34.png" class="img-thumbnail">

2 个答案:

答案 0 :(得分:0)

尝试这个来获取图像src

  var image_src = $('img.img-thumbnail').attr('src');

答案 1 :(得分:0)

对于html

<img src="my_path.png" class="retrieve">
<img src="my_path_2.png" class="retrieve">

JQuery的

var attr = "";
$(".retrieve").each(function() {
    attr = $(this).attr("src");
    //insert the attr into your array
});