結合2個jQuery腳本，使DIV成爲一個鏈接並打開模式

Question

我有2個jQuery腳本，我不確定如何組合它們。

腳本＃1：DIV內部有一個鏈接，使整個DIV可點擊的鏈接。

腳本＃2：從鏈接打開模式窗口（標準jQuery UI模式）。

下面是HTML：

<div class="singlefeatureditem"> 
<a href="product.php?id=123" class="opennewwindow"> 
<img src="products/thumb_placeholder.jpg" width="125" height="125" alt="thumb"><br> 
Item 1</a> 
</div> 

以下是JS：

//make the whole div clickable 
$(document).ready(function() { 
    $(".singlefeatureditem").click(function(){ 
    window.location=$(this).find("a").attr("href"); 
    return false; 
    }); 
}); 

//open the link in a modal window 
    $(function(){ 
     $('a.opennewwindow').click(function() { 
      var url = this.href; 
      // show a spinner or something via css 
      var dialog = $('<div style="display:none" class="loading"></div>').appendTo('body'); 
      // open the dialog 
      dialog.dialog({ 
       // add a close listener to prevent adding multiple divs to the document 
       close: function(event, ui) { 
        // remove div with all data and events 
        dialog.remove(); 
       }, 
       modal: true 
      }); 
      // load remote content 
      dialog.load(
       url, 
       {}, // omit this param object to issue a GET request instead a POST request, otherwise you may provide post parameters within the object 
       function (responseText, textStatus, XMLHttpRequest) { 
        // remove the loading class 
        dialog.removeClass('loading'); 
       } 
      ); 
      //prevent the browser to follow the link 
      return false; 
     }); 
    }); 

結果目前我得到（我猜是預期）是，如果我點擊鏈接我得到模態，如果我點擊DIV（鏈接外）鏈接工作，但它只是打開沒有模式的頁面。

我想使整個DIV成爲一個鏈接並打開模式，而不管點擊DIV中的哪個位置。

有什麼想法？ 謝謝！ Chris

Answer 1

當您使用window.location時，不會觸發鏈接的onclick事件。嘗試模擬點擊，如下所示：

//make the whole div clickable 
$(document).ready(function() { 
    $(".singlefeatureditem").click(function(){ 
    $(this).find("a").click(); /// << "simulate" a click 
    return false; 
    }); 
});