admin管理员组

文章数量:1311757

I am trying to use jquery-confirm. Please see the code and the result following. The result doesn't same with we saw on website. anything wrong?

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
     <script src="../js/jquery-3.2.1.min.js"></script>
     <link rel="stylesheet" href="../jquery-confirm-master/dist/jquery-confirm.min.css">
<script src="../jquery-confirm-master/dist/jquery-confirm.min.js"></script>
 </head>
 <body>
 <script>
    $.alert({
    width :'auto',
    title: 'Alert!',
    content: 'Simple alert!'
});
</script>
 </body>
</html>

I am trying to use jquery-confirm. Please see the code and the result following. The result doesn't same with we saw on website. anything wrong?

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
     <script src="../js/jquery-3.2.1.min.js"></script>
     <link rel="stylesheet" href="../jquery-confirm-master/dist/jquery-confirm.min.css">
<script src="../jquery-confirm-master/dist/jquery-confirm.min.js"></script>
 </head>
 <body>
 <script>
    $.alert({
    width :'auto',
    title: 'Alert!',
    content: 'Simple alert!'
});
</script>
 </body>
</html>

  • javascript
  • jquery
Share Improve this question edited May 14, 2017 at 17:50 Mark Amery 155k90 gold badges430 silver badges470 bronze badges asked May 14, 2017 at 15:41 wilsonchinawilsonchina 211 silver badge3 bronze badges
Add a ment  | 

3 Answers 3

Reset to default 5

It is working fine but not displaying as expected because you need disable bootstrap theme, see following code:

<script>
    $.alert({
        width :'auto',
        title: 'Alert!',
        content: 'Simple alert!',
        useBootstrap: false // Key line
    });
</script>

But if you want to use bootstrap theme you should include following CDN links in your document.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn./bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis./ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn./bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare./ajax/libs/jquery-confirm/3.0.3/jquery-confirm.min.css">
<script src="https://cdnjs.cloudflare./ajax/libs/jquery-confirm/3.0.3/jquery-confirm.min.js"></script>

I disabled bootstrap and used pixels for width

boxWidth: '30%',
useBootstrap: false,

Seems like you need to add the following, or just try to add bootstrap.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn./bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis./ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn./bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare./ajax/libs/jquery-confirm/3.0.3/jquery-confirm.min.css">
<script src="https://cdnjs.cloudflare./ajax/libs/jquery-confirm/3.0.3/jquery-confirm.min.js"></script>

本文标签： javascriptfailed to set width in jqueryconfirmStack Overflow

版权声明：本文标题：javascript - failed to set width in jquery-confirm? - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1741874635a2402391.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。