jquery - 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;
});
});