jquery在具有高度+重量的弹出窗口中打开url并将参数传递给它

Posted 2023-02-25

【中文标题】jquery在具有高度+重量的弹出窗口中打开url并将参数传递给它

【英文标题】：jquery open url in popup window with height + weight and pass a param to it

【发布时间】：2012-06-30 04:36:48

【问题描述】：

我试图在单击 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

解决这个问题的好方法是什么？

【参考方案1】：

试试这个

<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>

【参考方案2】：

试试这样的：

<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>

【讨论】：

好的，谢谢！差不多就是这样，但是 1 JS 脚本必须方便多个 div，所以一种从 id="alex" 之类的元素传递用户名并使用它并传递它的方法就像问题一样

好吧： Alex 点击这个 div Jonh 点击这个 div

【参考方案3】：

好的，试试这个

<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>

【参考方案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;
);
);