两个功能不在一起工作，但没有任何错误

Question

我有一对夫妇的JavaScript函数其中：

• 显示/隐藏了一些表行
• 添加一个新行

两个工作在同一页面上，但不是在特定情况下。

这里是下面的代码的fiddle：

/*************** show/hide sections ***************/ 
$('.arrow').click(function(event) { 
    var sec_id = $(this).attr('id').split('.')[0]; // admin.link -> admin 

    if ($(this).closest('td').attr('class') == 'subtitle') 
     $('.s_'+sec_id).toggle();     // toggle hide/show for 1 item (section) 
    else 
     $(this).closest('tr').nextUntil('tr:not(.s_' + sec_id+')').toggle(); 

}); 

/*************** Add rows ***************/ 
$('.add_row').click(function(event) { 
    var sid = $(this).attr('sid');     // the id of the <tbody> 
    var tbody = document.getElementById(sid); // the <tbody> to add rows to 

    // === GENERATE NEW NAMES for inputs 
    // get the name of the first input in the last row 
    var rows = tbody.rows; 
    var rowinput = rows[rows.length-1].getElementsByTagName('INPUT'); 
    // split name into array 
    var name_piece = rowinput[0].name.split(']['); 
    // create name for next row; check if last row is a blank row 
    var reg = new RegExp('^[0-9]+$'); 
    if (reg.test(name_piece[1])) // if integer 
     var iteration = parseInt(name_piece[1], 10) + 1; // convert to int with base 10 
    else 
     iteration = 1; 
    if (iteration < 10) 
     iteration = '0'+iteration;     // add left padding to ensure sort order 
    var front = 'items['+sid.substring(2)+']['+iteration+']'; // front of input name (remove the 's_' from name) 
    // END GENERATE NEW NAMES for inputs 

    // === CREATE ROW 
    var row = document.createElement('tr');   // create a row 
    var td1 = document.createElement('td');   // create first cell 
    td1.setAttribute('colSpan', 2); 
    td1.innerHTML = '<input type="text" name="'+front+'[desc]" maxlength="100" />'; 
    var td2 = document.createElement('td');   // create second cell 
    td2.innerHTML = '<input type="text" name="'+front+'[price]" maxlength="9" onChange="calc_ttl()" class="right small" />'; 
    var td3 = document.createElement('td');   // create third cell 
    td3.setAttribute('colSpan', 3); 
    // END CREATE ROW 

    // output 
    row.appendChild(td1); 
    row.appendChild(td2); 
    row.appendChild(td3); 
    tbody.appendChild(row); 
}); 

在小提琴，你会看到3个环节，所有这些工作，他们应该。唯一的例外是如果我在显示隐藏行时添加一行;例如：

1. 点击 “小节”，以示行
2. 点击 “添加一行”
3. 点击 “小节”，以隐藏行< - 失败这里

从此，除非我重新加载页面，否则“子部分”链接不再有效。代码检查出来，Firebug报告没有错误，所以我不知所措。任何建议非常感谢。

Answer 1

问题不在于你在这里发布的jQuery代码。它在HTML中。在你的提琴您有：

<tr onMouseOver="this.className='highlight'" onMouseOut="this.className='normal'" class="s_grp_2d_ttl_asset" style="display: none;"> 

一旦该行是可见的，只要在它的鼠标移动，s_grp_2d_ttl_asset类由highlight类，这使得您的点击事件停在第一个元素所取代。如果您使用addClass，removeClass或toggleClass函数，则可以在不完全删除原始类的情况下进行更改。