如何在java腳本中識別div中以前的span元素

Question

在我的應用程序中，我有兩個div。第一個div包含一個跨度。第二個div是5個div元素的集合。當點擊第二個div中的3個div的任何一個時，我想知道/找到第一個div，它是該div內的span的id。請任何人幫我解決這個問題。

編輯： HTML

<ul> 

    <li> 

      <div class="fleft"> 
       <span id="user_id" class="no-class"> User</span> 
      </div> 
      <div style="display: inline-block;">     
        <div class="info left no-class section">Jan</div> 

      </div> 
    </li> 
<li> 

      <div class="fleft"> 
       <span id="user_id" class="no-class"> User</span> 
      </div> 
      <div style="display: inline-block;">     
        <div class="info left no-class section">Jan</div> 

      </div> 
    </li> 
<ul> 

JS

$('.info').click(function(event){ 
}); 

注： 在我的第二個div我有3個元素（原代碼包含一個循環來創建3級div的）。在這div我能夠使用prev（），next（）;獲得下一個和上一個div。但無法找到id爲user_id的範圍。

編輯： 在一個李我有兩個div。 Div1構成

<div class="fleft"><span id="user_id_1"></span></div> 

Div2的

<div class="right"> 
    <div class="info left no-class section> Jan</div> 
    <div class="info left no-class section> Feb</div> 
    <div class="info left no-class section> March</div> 
</div> 

同時點擊一月/二月/三月，我想知道跨度的ID是DIV1內。

UpdtedFiddle：http://jsfiddle.net/uj8ox3o1/2/

Answer 1

請描述你的問題更清楚
這是我得到：
如果你點擊的元素有你想要的跨度的ID是變得更容易

$('.info').click(function(event){ 
$(this).parents('div.fleft').find('span#ID') 
}); 

這是什麼我從你的問題中得到：|

Answer 2

如果我理解正確，你要查找的用戶ID跨度的關聯值...

HTML：

<ul> 
    <li> 
     <div class="fleft"> <span id="user_id1" class="no-class"> User</span> 
     </div> 
     <div style="display: inline-block;"> 
      <div class="info left no-class section">Jan</div> 
      <div class="info left no-class section">Feb</div> 
      <div class="info left no-class section">Mar</div> 
      <div class="info left no-class section">Apr</div> 
     </div> 
    </li> 
    <li> 
     <div class="fleft"> <span id="user_id2" class="no-class"> User</span> 
     </div> 
     <div style="display: inline-block;"> 
      <div class="info left no-class section">Jan</div> 
      <div class="info left no-class section">Feb</div> 
      <div class="info left no-class section">Mar</div> 
      <div class="info left no-class section">Apr</div> 
     </div> 
    </li> 
</ul> 

JS：

$('.info').click(function (event) { 
    var id = $(this).closest('li').find('.fleft span[id]').attr('id'); 
    alert(id); 
}); 

這將提醒在您的span上指定的編號的值，無論您在哪月div s點擊了

* Updated fiddle *

Answer 3

<ul> 

    <li> 

      <div class="fleft"> 
       <span id="user_id" class="no-class"> User</span> 
      </div> 
      <div style="display: inline-block;">     
        <div class="info left no-class section">Jan</div> 

      </div> 
    </li> 
<li> 

      <div class="fleft"> 
       <span id="user_id" class="no-class"> User</span> 
      </div> 
      <div style="display: inline-block;">     
        <div class="info left no-class section">Jan</div> 

      </div> 
    </li> 
<ul> 


<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("ul li div span").click('on',function(){ 
     $id=$(this).attr('id'); 
        alert($id); 
    }); 
    }); 
    </script> 

演示jsfiddle。

Answer 4

在JS

$('.info').click(function(event){ 
    parent_element = this.parentNode; 
    adjacent_element = $(parent_element).prev(); 
    adjacent_element.children('span')[0].id; 
});