Question

我有一个如下表格，当用户点击表格'/ledesInvoiceErrors.do?InvoiceId='+parentInstanceId'和INV1的发票编号列时，我尝试打开一个包含INV2链接的弹出窗口转到与发票号码字段关联的超链接。

http://jsfiddle.net/pmgguwob/3/

<div class="listTable expanded">
  <table class="searchResults {id:321}">
     <thead>
        <tr class="tipAdded">
           <th class="first unsortable ui-state-default ui-state-hover ui-state-active"></th>
           <th data-name="Invoice Number" class="typeString    ui-state-default ui-state-hover sort asc ui-state-active" id="sort_invoiceNumber">
              Invoice Number
           </th>
           <th data-name="Invoice Total" class="typeMoney last   ui-state-default ui-state-hover ui-state-active sort" id="sort_invoiceTotal">
              Invoice Total
           </th>
        </tr>
     </thead>
     <tbody class="">
        <tr class="tipAdded">
           <td class="first">
              <div style="display:none" class="renderedValue">
                 INV1
              </div>
               <input value="65" name="invoices0.id" type="hidden" class="check"/>
           </td>
           <td class="typeString  ">
              <div class="data typeString"><a tooltip="" class="listLink " title="" href="/CP/show.do?parentInstanceId=51;parentFieldName=invoices">
                 INV1        
                 </a>
              </div>
           </td>
           <td class="typeMoney  ">
              <div class="data typeMoney">
                 15.25 USD        
              </div>
           </td>
        </tr>
        <tr class="tipAdded">
           <td class="first">
              <div style="display:none" class="renderedValue">
                 INV2
              </div>
               <input value="66" name="invoices1.id" type="hidden" class="check"/>
           </td>

           <td class="typeString  ">
              <div class="data typeString"><a tooltip="" class="listLink " title="" href="/CP/show.do?parentInstanceId=55;parentFieldName=invoices">
                 INV2        
                 </a>
              </div>
           </td>
           <td class="typeMoney  ">
              <div class="data typeMoney">
                 111.25 USD        
              </div>
           </td>
        </tr>
     </tbody>
  </table>

我是jQuery的初学者，我真的不知道如何实现这一目标。有人可以用这个来取悦我吗？

注意：我没有自由修改与发票编号字段关联的超链接，因为这些链接是从我们的内部框架生成的。但我可以在我的页面上嵌入jquery脚本来覆盖超链接

解决方案更新 http://jsfiddle.net/pmgguwob/10/

Answer 1

要覆盖超链接的行为，您可以执行以下操作：

$(function(){
    // you may have to narrow down the selector here to a specific class or 'td'
    $(".searchResults a").on('click', function(e){
        e.preventDefault();                    
        var url = $(this).attr('href');
        window.open(url, 'window name', 'window settings');
        return false;
    });
});

<强> Updated Fiddle

Answer 2

在这种情况下，像这样（fiddle）：

$("a").click(function (e) {
    e.preventDefault();
    var mills = (new Date).getTime();
    window.open($(this).attr("href"), mills);
    //$("body").append("#" + $(this).attr("href") + "#");
});

我正在使用mills为每个窗口提供一个新句柄，因此您不会重复使用窗口，并可能通过重新加载隐藏它们的窗口来混淆您的用户。最后一行只是显示它用于测试的URL;你可能想要按摩那个价值，但我相信它是正确的。

我知道window.open不是新鲜而且很酷，但its options可让您以足够的粒度控制新窗口的外观。如果你愿意的话，你可以改为jQuery。

jQuery覆盖表td值中的超链接

2 个答案: