Question

我尝试找到这个问题的解决方案，但我找不到合适的文章

    <div class="panel ui-widget-content" id="invoiceList">
<h2 class="ui-widget-header ui-corner-top" style="cursor: pointer; "><span>Invoices</span></h2>
    <table cellspacing='0' id='header' class="ui-widget">
        <tr>
            <th>Invoice Number</th>
             <th>Invoice Total</th>
        </tr>     
        <tr>
            <td><a href="#"  >INV-Error_Test1</a></td>
            <td>22.000000 USD</td>
        </tr>
        <tr>
            td><a href="#"  >INV-Error_Test2</a></td>
           <td>22.000000 USD</td>
        </tr>
    </table> 
</div>
<div class='panel ui-widget-content' id="invoiceErrors">
<h2>Select a Invoice from the left to view Error Details</h2>
  <div class='panel ui-widget-content' id="invoiceHeaders">
    <h2 class="ui-widget-header ui-corner-top" style="cursor: pointer; "><span>Invoice Headers</span></h2>
        <table class="ui-widget">
           <tr>
                <th>Invoice Number</th>
                 <th>Matter Number</th>
                <th>Invoice Total</th>
                <th>Invoice Tax Total</th>
                <th>Invoice Net Total</th>
          </tr>

        <tr>
            <td><%= invoiceNumber%></td>
            <td>CC_MAT_1221</td>
            <td>22.000000 USD</td>
            <td>22.000000 USD</td>
            <td>22.000000 USD</td>
        </tr>

        <td class = 'error'>File Error : The file does not contain any record delimiters or is in an unsupported format</td>

       </table> 
    </div>
    <div class='panel ui-widget-content' id="invoiceLines">
    <h2 class="ui-widget-header ui-corner-top" style="cursor: pointer; "><span>Invoice Line Items</span></h2>
     <table class="ui-widget">
        <tr>
            <th>Line Item Number</th>
            <th>Line Item Date</th>
            <th>Unit Cost</th>
            <th>Number of Units</th>
            <th>Line Item Total</th>
            <th>Task Code</th>
            <th>Expense Code</th>
            <th>Timekeeper ID</th>
            <th>Line Item Description</th>
        </tr>
        <tr>
            <td>2</td>
            <td>20150304</td>
            <td>2</td>
            <td>2</td>
            <td>6</td>
            <td></td>
            <td>E2</td>
            <td></td>
            <td></td>
        </tr>
        <td class='error'><%= invoiceNumber%> Line : 2 Invoice does not foot Reported = (22.0)Calculated (18.0)</td>
        <tr>
            <td>3</td>
            <td>20150306</td>
            <td>3</td>
            <td>3</td>
            <td>12</td>
            <td>T3</td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
    </table>
    </div>
 </div>

这是jsfiddle链接http://jsfiddle.net/5n62md3m/

我可以从invoiceList div获取发票编号，如下所示

 $("#invoiceList a").click(function (e) {
console.log('invoice --->'+$(this).text());
});

但我不确定如何将其发送到invoiceNumber div

中的invoiceErrors

有人可以帮帮我吗？

Answer 1

更新的答案

更好的是，感谢其中一条评论，请为单元格提供ID，例如＃invoice-number-error＆＃39;然后直接用jQuery定位，不需要.find（），让一切变得更快。

又名：

$("#invoiceList").find('a').click(function (e) {
    var invoiceNumber = $(this).text();
    $('#invoice-number-error').text(invoiceNumber);
});

OLD ANSWER

我建议给表格单元格类，我更新了你的filddle以反映一个变化：

我添加了班级＆＃39;发票编号＆＃39;到#invoiceErrors下的那个单元格。然后我将您的功能更新为：

$("#invoiceList").find('a').click(function (e) {
    var invoiceNumber = $(this).text();
    $('#invoiceErrors').find('.invoice-number').text(invoiceNumber);
});

Answer 2

为您的表格设置mytable，然后执行：

$("#mytable td").eq(0).html( $(this).text() );

jQuery Pass td onclick value to other table

2 个答案:

Working jsFiddle