2011-12-27 10 views
5

は、私はこれを持って言います。コンテナにイメージが含まれていない場合は、コンテナ内にイメージが存在しないというエラーが表示されます。さもなければ、私はイメージのすべてのIDのリストを取得したいと思います。div内のattribを取得しますか?私はそれ内の画像のIDを取得したい、私はコンテナをクリックすると、今私を</p> <pre><code><div class='container'> <img src='image1' id='1' /> <img src='image2' id='2' /> ... </div> <div class='container'> </div> </code></pre> <p>:

$('.container').click(function() 
{ 
     var images = $(this).find('img'); 
     if(images[0] == null) { //no image found } 
     else 
     { 
      // No idea what to do here :P 
     } 
} 

誰かがここに(私は他の{}内の文を意味する)私を助けてくださいことができます:

のjQueryを使用して、私はこれを持っていますか?感謝:)

答えて

8
$(document).on("click", ".container", function(){ 
    var img = $(this).find("img"), // select images inside .container 
     len = img.length; // check if they exist 
    if(len > 0){ 
     // images found, get id 
     var attrID = img.first().attr("id"); // get id of first image 
    } else { 
     // images not found 
    } 
}); 

Example

var arr = []; // create array 
if(len > 0){ 
    // images found, get id 
    img.each(function(){ // run this for each image 
     arr.push($(this).attr("id")); // push each image's id to the array 
    }); 
} else { 
    // images not found 
} 

Example

は、コンテナ内のすべての画像の idの配列を取得します。

そして、私はあなたに純粋なJSと例得られなかった場合はもちろん、私がどんな人かを次のようになります。

var elems = [].slice.call(document.getElementsByClassName("container")); 
elems.forEach(function(elem){ 
    elem.onclick = function(){ 
     var arr = [], 
      imgs = [].slice.call(elem.getElementsByTagName("img")); 
     if(imgs.length){ 
      imgs.forEach(function(img){ 
       var attrID = img.id; 
       arr.push(attrID); 
      }); 
      alert(arr); 
     } else { 
      alert("No images found."); 
     } 
    }; 
}); 

Exampleを。もう少し複雑で、jQueryを使用することをお勧めします。これは、クロスブラウザーのマウスイベントの狂気をすべてクリアするからです。

0
var images = $(this).find('img'); 
    if(images.length === 0) { 
     alert('no images found'); 
    } 
    else { 
     var ids = new Array; 
     images.each(function(){ 
      ids.push($(this).attr('id')); 
     }); 
     //ids now contains all the ids of img elements 
     console.log(ids); 
    } 
+0

私はその部分を手に入れました!私は残りのために何をするのですか? else {}文の中に! – user1083320

+0

コードを更新しました。 – Ehtesham

0
$('.container').click(function() 
{ 
var images = $('img',this); 
if($(images).length == 0) { 
     // No Image 
    } 
    else  { 
     var ids = ''; 
     $(images).each(function(){ 
      ids = $(this).attr('id) + ","; 
     }); 
     alert(ids); 
    } 
} 
関連する問題

 関連する問題