如何在javascript警告框中添加一些html行

yzxexxkh 于 2023-05-27 发布在 Java

关注(0)|答案(3)|浏览(117)

我想创建一个警告框的一些细节，但我的代码是不工作，请帮助我。

<script>
alert('<ul>
 <li>Language must be in english .</li>
 <li>Topic's must be on Digitalcoin.</li>
 <li>Write a good title.</li>
 <li>Don't give <b>Read More</b> button with other sites link.</li>
</ul>',{
  ok : 'Ok'
})
</script>

JavaScript

来源：https://stackoverflow.com/questions/39706429/how-to-add-some-html-line-on-javascript-alert-box

3条答案

按热度按时间

2izufjch1#

抱歉，您不能将html放入原生JavaScript的警报中。你可以使用jquery的dialog或bootstart的alert，这里的例子：
https://jqueryui.com/dialog/
http://www.w3schools.com/bootstrap/bootstrap_alerts.asp

赞(0）回复(0）举报 2023-05-27

eulz3vhy2#

您可以创建自己的自定义警告框以允许html标记。或者你可以使用像@epascarello提到的库。这是一个great article on how to create your own modal box with html5 and css3。我已经走在前面，创造了一个起点。
这是jsfiddle。

赞(0）回复(0）举报 2023-05-27

uqzxnwby3#

您可以使用替代解决方案来解决此类问题，方法是创建包含某些内容的div元素，然后使用JavaScript切换隐藏/显示。代码如下：

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>

#adddiv {
display: none; 
text-align: center;
width: 80%; /*border-radius: 25px;*/ 
border: 2px solid Black; 
padding: 15px 15px 15px 15px; 
margin: 20px 20px 20px 20px; 
//background: #fff//#A4D3EE; 
overflow: visible; 
box-shadow: 5px 5px 2px #888888; 
position: relative; } 
#xadd { position: absolute; 
background: yellow; 
color: black; top: -10px; 
right: -10px; }
#add { position: absolute; 
background: #3caea3;//#3c99dc; 
color: white; }

#deldiv {
display: none;
text-align: center;
width: 80%; /*border-radius: 25px;*/ 
border: 2px solid Black; 
padding: 15px 15px 15px 15px; 
margin: 20px 20px 20px 20px; 
//background: #fff//#A4D3EE; 
overflow: visible; 
box-shadow: 5px 5px 2px #888888; 
position: relative; }
#xdel { position: absolute; 
background: blue; 
color: white; top: -10px; 
right: -10px; }
#del { position: absolute; 
background: red;//#3c99dc; 
color: white; }
</style>
<script>
function myFunctionaddopen() {
var x = document.getElementById("adddiv");
if (x.style.display !== "none") {
  x.style.display = "block";
} else {
    x.style.display = "block";
      }
    }
    </script>
<script>
function myFunctionaddclose() {
var x = document.getElementById("adddiv");
if (x.style.display === "none") {
  //x.style.display = "block";
} else {
x.style.display = "none";
  }
}
</script>

<script>
function myFunctiondelopen() {
var x = document.getElementById("deldiv");
if (x.style.display !== "none") {
  x.style.display = "block";
} else {
    x.style.display = "block";
      }
    }
    </script>
<script>
function myFunctiondelclose() {
var x = document.getElementById("deldiv");
if (x.style.display === "none") {
  //x.style.display = "block";
} else {
x.style.display = "none";
  }
}
</script>
</head>
<body>

<p>Click the action buttons below to open the modals:</p>

<button id="add" onclick="myFunctionaddopen()">button_1</button>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
<button id="del" onclick="myFunctiondelopen()">button_2</button>

<div id="adddiv">
This is the first modal Exit by clicking on the "x" button at the top right coner.
<button id="xadd" onclick="myFunctionaddclose()">x</button>
</div>

<div id="deldiv">
This is the second modal Exit by clicking on the "x" button at the top right coner.
<button id="xdel" onclick="myFunctiondelclose()">x</button>
</div>

</body>
</html>

赞(0）回复(0）举报 2023-05-27

我来回答

如何在javascript警告框中添加一些html行

3条答案

相关问题

热门标签

最新问答