jquery父子選擇改進

我正在學習jquery，希望能夠做得更好。我找到了一個解決方案，並希望看到一個經驗豐富的老將如何做到這一點......如果說有更多的口才，可以這麼說。jquery父子選擇改進

問題是我有一個小部件放在表格行中。該小部件與所有其他小部件具有相同的類。當有人點擊一個特定的小部件時，只有那個小部件應該改變。

這裏的HTML：

<div class="deal-widget"> 
    <div class="deal-widget-left"> 
    <div class="deal-widget-left-countdown"> 
     <span class="totalcoupons">500</span> of <span class="maxcoupons">500</span> 
    </div> 
    <div class="deal-widget-left-remain"> 
     Remaining 
    </div> 
    </div> 
    <div class="deal-widget-right is_open"> 
    <a href="/deal/claim/1113" class="deal-link">Claim It!</a> 
    </div> 
</div>

這裏是我的刺在JQuery的：

Drupal.behaviors.plusone = function (context) { 
    $('a.deal-link:not(.deal-processed)', context).click(function() { 
    var parent = $(this).parents('div.deal-widget'); 
    var originalVote = parent.children('div.deal-widget-left').children('div.deal-widget-left-countdown').children('span.totalcoupons').text(); 
    var originalVoteInt = parseInt(originalVote); 
    var voteSaved = function (data) { 
     parent.children('div.deal-widget-left').children('div.deal-widget-left-countdown').children('span.totalcoupons').html(originalVoteInt - data.total_votes); 
     parent.children('div.deal-widget-right').html(data.voted); 
     parent.children('div.deal-widget-right').removeClass('is_open').addClass(data.votedClass); 
    } 
    $.ajax({ 
     type: 'POST', 
     url: this.href, 
     dataType: 'json', 
     success: voteSaved, 
     data: 'js=1' 
    }); 
    return false; 
    }) 
    .addClass('deal-processed'); 
}

有選擇父然後第二組的孩子到一個更好的方式一點擊，在物體比這個？

由於

喬

來源

2011-07-05 Joe Hyde

我建議使用：

var parent = $(this).closest('div.deal-widget'); 
var originalVote = parent.find('span.totalcoupons').text();

closest()搜索所提供的選擇器相匹配的第一個元素的祖先元素; find()搜索與提供的選擇器匹配的後代元素。

雖然closest()只返回一個匹配（在最接近/*第一個*的選擇匹配元素）需要注意的是find()可能返回多個元素是很重要的。

參考文獻：

closest()。
find()。

來源

2011-07-05 22:06:34

.closest（）的作品就像一個魅力！感謝diff方法。我正在使用它。 - 喬 –

不客氣！我很高興有幫助=）我會建議，如果這個或者其他的答案解決了你的問題，你應該考慮接受（點擊答案旁邊的勾號）或者增加投票（點擊左側的向上箭頭）。這不是強制性的，但受到社區的讚賞。 –

我點擊了複選標記，它變成了綠色。我還沒有贏得投票的狀態。但是當我做...喬 –

使用find（）？所以：

var originalVote = parent.children('div.deal-widget-left').children('div.deal-widget-left-countdown').children('span.totalcoupons').text();

變爲：

var originalVote = parent.find('span.totalcoupons').text();

我不知道你在尋找什麼在這裏...

來源

2011-07-05 22:08:26 Michael

jquery父子選擇改進

回答

相關問題