0

可能重复：
如何在 Javascript 中换行

我正在使用下面的 javascript 在客户端网站的页面加载时显示弹出消息。我是 js 的真正新手，只能复制/粘贴我在网上找到的示例。需要知道如何设置弹出框的宽度。我希望文本跨越两行，而不仅仅是跨越页面的宽度。这是它的外观示例 www.manageourwebsite.com.au

<body onload="WelcomeMSG()">
    <script language="JavaScript">

<!--
function WelcomeMSG () 
{
alert("Our Retail shop front will be closed from Friday 21st December 2012 thru to Monday 21st January 2013. The Online store will be open 24/7 as usual  with all online orders being processed as normal.")

}

 -->
    </script>
4

3 回答 3

1

我会用一点 CSS（根据自己的喜好设置样式）和一行 javascript

<style type="text/css">
    #holiday-overlay{
        position:fixed;
        top:0; left:0; right:0; bottom:0;
        background: rgba(255,255,255,0.7);
        z-index:9999;
    }
    #holiday-message{
        width:400px;
        padding:30px;
        background-color: black;
        left:50%;
        top:40%;
        margin-left:-200px; /*half of width*/
        border-radius:5px;
        color:white;
        position:relative;
    }
    #holiday-close{
       paddding:5px;
       position:absolute;
       right:10px;
       top:10px;
       cursor:pointer;
       font-weight:bold;
       color:white;
    }
</style>
<div id="holiday-overlay">
    <div id="holiday-message">
        <a onclick="var el = document.getElementById('holiday-overlay'); el.parentNode.removeChild(el)" id="holiday-close">&times;</a>
        Our Retail shop front will be closed from Friday 21st December 2012 thru to Monday 21st January 2013.<br/>
        The Online store will be open 24/7 as usual  with all online orders being processed as normal.
    </div>
</div>

演示在http://jsfiddle.net/gaby/NgvCj/embedded/result/

于 2012-12-18T00:58:00.540 回答
1

Well for starters you can't really edit the alert box's width. See here for a similar question about this:

how to change the style of alert box

Sure you can do some hackish things like \n but that still doesn't give you the customization you COULD have. I would highly suggest making your own alertbox using a div that you style on your own and write the javascript manually so it pops up like an alert. Take a look @Gaby aka G. Petrioli answer below. He has a very good example. You can also try using some APIs that do it for you.

jQuery dialog is one of many but to give you a sense of how it works (since it seems you are new) jQuery does most of the work for you -- all you really have to do is src their javascript file into your code and then call on it accordingly. You can check out some of the functions they provide for you here. Specifically I linked you to the minWidth section because I believe that is something you are looking for.

If you have questions on how to use jQuery or get confused, feel free to comment here. We like to see people trying to code on Stackoverflow so don't be shy to ask questions (just make sure you are asking good ones and researching before you post). We were all novices once -- the way we become experts is through application and experimentation.

于 2012-12-18T01:01:03.857 回答
0

如果您希望将文本包装成两行，我建议您在文本的所需位置添加 \n 换行符：

alert("Hello\nWorld")
于 2012-12-18T00:38:02.673 回答