如何迭代低谷HTML節點以查找匹配並從節點獲取下一個innerHTML

我有一個表單元素<select>來選擇一個人。只要元素髮生變化，就會執行功能getPerson()並讀出所選條目的值。如何迭代低谷HTML節點以查找匹配並從節點獲取下一個innerHTML

<select id="cust_id" name="f_cust_id" onchange="getPerson(this)"> 
    <option value="51">Brad Pitt</option> 
    <option value="123">Angelina Jolie</option> 
    <option value="13">Jennifer Aniston</option> 
</select>

下一步是：我有一個隱藏的文本在同一頁，我想要找到這個值（例如值51）。我需要迭代通過這個hiddenCustomer節點。

隱藏HTML文本

<div id="hiddenCustomer" style="display:none;"> 
    <span>51</span><span>Brad;Pitt;Y1;Group1;[email protected];12345</span> 
    <span>123</span><span>Angelina;Jolie;Y2;Group2;[email protected];12346</span> 
    <span>13</span><span>Jennifer;Aniston;Y1;Group1;[email protected];12347</span> 
</div>

終於如果我有一個匹配51 = 51我從下一個元素和「分裂」它的陣列的字符串。它將被用來填寫一些形式領域，如：名字，姓氏，地板，組，電子郵件......

我的問題是：如何迭代最好的通過hiddenCustomer節點。找到匹配並從下一個元素（例如：Brad; Pitt; Y1; Group1; [email protected]; 12345）獲取innerHTML值

ps：我不想使用JSON對象...

來源

2013-07-09 Daniel Stutz

事情會更容易些...... 還，在ID工作的選擇器更高性能... – 5arx

function getPerson(element){ 
    var elementsArray = []; 
    $("#hiddenElement").each(function(){ 
     $(this).find("span").each(function(){    
      if($(this).text() == $(element).val()){ 
       elementsArray = $(this).find("span").next().text().split(';'); 
      } 
     }); 
    }); 
}

你有一個字符串數組結束。

來源

2013-07-09 09:20:17

看起來不錯..謝謝 –

你可以這樣做：

var value = 51; 

var $span = $('#hiddenCustomer span:nth-child(odd)').filter(function(){ 
    return parseInt($(this).text(),10) == value; 
}).next('span'); 

console.log($span.html());

來源

2013-07-09 09:17:21

謝謝它的工作原理！ –

很高興幫助！ –

你可以這樣做

[DEMO]如果你嵌套數據跨越到另一個容器，因此他們的子元素-->http://fiddle.jshell.net/ykF6P/

function getPerson(element) 
{ 
    var val = element.value; 
    var $span = $('#hiddenCustomer span').filter(function(){ 
     return $(this).text() == val; 
    }).next('span'); 
}

來源

2013-07-09 09:21:17

如何迭代低谷HTML節點以查找匹配並從節點獲取下一個innerHTML

回答

相關問題