jQuery按钮点击属性（'src'）返回未定义

图片& ID为img src是由Jinja2模板动态生成的&图片通过函数返回。所以我打算使用$ this jquery选项按钮元素获取img src。 这是Jinja2的模板代码...jQuery按钮点击属性（'src'）返回未定义

<div id="center-container" class="span9"> 
    {% for article_row in images | batch(3, '&nbsp;') %} 
     <ul class="thumbnails"> 
     {% for article in article_row %} 
      <li class="span3"> 

       <div class="thumbnail"> 
       <img src ="img/{{ article|e }}" data-src="holder.js/360x270" alt="" id="img{{loop.index}}"> 

       <h3>Thumbnail label</h3> 
       <p>{{ article }}</p> 
       </div> 
      <button class="btn btn-inverse" type="button" id="img{{loop.index}}">Large button</button> 
      </li> 
     {% endfor %} 
     </ul> 
    {% endfor %} 
</div>

这是渲染后的页面源：

<html> 
<head> 
</head> 
    <body> 
<div id="center-container" class="span9"> 
    <ul class="thumbnails"> 
     <li class="span3"> 
      <div class="thumbnail"> 
      <img src ="img/allofthethings.png" data-src="holder.js/360x270" alt="" id="img1"> 
      <h3>Thumbnail label</h3> 
      <p>allofthethings.png</p> 
      </div> 
     <button class="btn btn-inverse" type="button" id="img1">Large button</button> 
     </li> 
     <li class="span3"> 
      <div class="thumbnail"> 
      <img src ="img/brogrammer.jpg" data-src="holder.js/360x270" alt="" id="img2"> 
      <h3>Thumbnail label</h3> 
      <p>brogrammer.jpg</p> 
      </div> 
     <button class="btn btn-inverse" type="button" id="img2">Large button</button> 
     </li> 
     <li class="span3"> 
      <div class="thumbnail"> 
      <img src ="img/couragewolf.jpg" data-src="holder.js/360x270" alt="" id="img3"> 
      <h3>Thumbnail label</h3> 
      <p>couragewolf.jpg</p> 
      </div> 
     <button class="btn btn-inverse" type="button" id="img3">Large button</button> 
     </li> 
    </ul> 
</div> 
<script src="http://code.jquery.com/jquery.js"></script> 
<script src="../inc/js/bootstrap.min.js"></script> 
</body>

这是我得到的错误： js函数

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("button").click(function(){ 
     var src=$(this).attr("src"); 
     alert(src); 
      alert($(this).attr('src')); 
     console.log(src); 
     }); 
    }); 
</script>

来源

2013-10-06 Simon K Bhatta4ya

没有 'SRC' 属性。试试这个代码：

$(document).ready(function() { 
    $("button").click(function(){ 
    var src=$(this).parent().find('img').attr('src'); 
    console.log(src); 
    }); 
});

来源

2013-10-06 09:40:33

ID的需要是唯一的，你似乎具有相同ID的按钮和img元素，$(this)指button和按钮没有src属性，所以更改：

var src=$(this).attr("src");

到

var src=$(this).parents("li.span3").find("img").attr("src");

来源

2013-10-06 09:35:16

或者，更好的是，使用'.closest（）'而不是'.parents（）'。 – nnnnnn

是的正确.... –

$(this)指的按钮，没有src属性，因此，将您的代码更改为

var src=$(this).closest("li.span3").find("img").prop("src");

而不是

var src=$(this).attr("src");

我会建议你使用的.prop()代替.attr()

来源

2013-10-06 09:37:35 Satpal

jQuery按钮点击属性（'src'）返回未定义

回答

相关问题