jquery在高度+重量的彈出窗口中打開url並將其傳遞給它

Question

我試圖加載一個div的url的點擊，但是在具有特定大小的新窗口中。比如我會

<div id="mydiv> 
    Roy 
    click on this div 
</div> 

和

<div id="mydiv> 
    Alex 
    click on this div 
</div> 

然後這個想法是一個新的窗口會彈出（非模態）有說喜歡300x400px尺寸。 用戶名應該傳遞給此窗口，我希望能夠在我的Web應用程序中使用它。 jquery只需要調用像/ chatwindow /？user = rob

什麼將是一個很好的方法來解決這個問題？

Answer 1

好吧，試試這個

<div id="mydiv-alex" class="mydiv"> 
    Alex click on this div 
</div> 
<div id="mydiv-jonh" class="mydiv"> 
    Jonh click on this div 
</div> 
<script> 
    $('.mydiv').click(function(){ 
    window.open(' /chatwindow/?user='+$(this).attr('id').replace('mydiv-',''), '_blank', 'width=300,height=400'); 
    return false; 
    }); 
</script> 

Answer 2

試試這個

<div id="mydiv"> 
    Alex 
    click on this div 
</div> 



<script type="text/javascript"> 
     var windowSizeArray = [ "width=200,height=200", 
           "width=300,height=400,scrollbars=yes" ]; 

     $(document).ready(function(){ 
      $('#mydiv').click(function (event){ 

       var url ="www.yourdomain.com/chatwindow/?user=rob"; 
       var windowName = "popUp";//$(this).attr("name"); 
       var windowSize = windowSizeArray[ $(this).attr("rel") ]; 

       window.open(url, windowName, windowSize); 

       event.preventDefault(); 

      }); 
     }); 
    </script> 

Answer 3

嘗試是這樣的：

<div id="mydiv"> 
    <span id="username">Alex</span> click on this div 
</div> 
<script> 
$('#mydiv').click(function(){ 
    window.open(' /chatwindow/?user='+$('#username').text(), '_blank', 'width=300,height=400'); 
return false; 
}); 
</script> 

或者這

<div id="mydiv"> 
    Alex click on this div 
</div> 
<script> 
var username = 'Alex'; 
$('#mydiv').click(function(){ 
    window.open(' /chatwindow/?user='+username, '_blank', 'width=300,height=400'); 
return false; 
}); 
</script> 

或者這

<div id="mydiv"> 
    Alex click on this div 
     <input type="hidden" name="username" value="Alex"> 
</div> 
<script> 
var username = 'Alex'; 
$('#mydiv').click(function(){ 
    window.open(' /chatwindow/?user='+$('#mydiv > input[name="username"]').val(), '_blank', 'width=300,height=400'); 
return false; 
}); 
</script> 

Answer 4

http://www.jquerybyexample.net/2012/05/open-link-in-new-tab-or-new-popup.html

$(document).ready(function() { 
$('A.BLAH').click(function() { 
var NWin = window.open($(this).prop('href'), '', 'height=600,width=1000'); 
if (window.focus) 
{ 
NWin.focus(); 
} 
return false; 
}); 
});