將CSS添加到AJAX彈出警報

我剛剛設法將AJAX添加到我的郵件列表訂閱表單中。它工作並顯示一個默認瀏覽器彈出來顯示消息。將CSS添加到AJAX彈出警報

我現在想爲它添加CSS樣式，它是頁面頂部的一個奇特的酒吧警報。我已經創建了CSS樣式，但我堅持如何在代碼中獲得它。我使用+ .addClass（「toast-top-full-width」）和其他一些方法，但一切都破壞了我的代碼。

任何幫助表示讚賞！

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">  </script> 
<script type="text/javascript"> 
$(function() { 
    $('#subForm').submit(function (e) { 
     e.preventDefault(); 
     $.getJSON(
     this.action + "?callback=?", 
     $(this).serialize(), 
     function (data) { 
      if (data.Status === 400) { 
       alert("Error: " + data.Message); 
      } else { // 200 
       alert("Success: " + data.Message); 
       ; 
      } 
     }); 
    }); 
}); 
</script>

來源

2016-10-23 superhappybunnycat

請張貼工作小提琴 – arnabkaycee

我不能讓它在那裏工作:(發佈一個URL我的網站上，你可以看到它 – superhappybunnycat

URL的位置在哪裏？ – arnabkaycee

如果你想風格你彈出，你不能使用alert功能。您必須將警告框添加爲頁面中的Html元素。那麼你可以用任何你想要的方式來設計它。

來源

2016-10-23 05:59:14 KWeiss

哎呀，謝謝！ – superhappybunnycat

你正在使用一個普通的舊JavaScript警告我猜。

這些東西不能被稱呼。

請爲此使用類似Bootstrap Modal對話框的內容，這些對話框是由純HTML和CSS創建的，並且您可以將其應用於樣式。引導對話的

例子：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button> 
 

 
<!-- Modal --> 
 
<div id="myModal" class="modal fade" role="dialog"> 
 
    <div class="modal-dialog"> 
 

 
    <!-- Modal content--> 
 
    <div class="modal-content"> 
 
     <div class="modal-header"> 
 
     <button type="button" class="close" data-dismiss="modal">&times;</button> 
 
     <h4 class="modal-title">Modal Header</h4> 
 
     </div> 
 
     <div class="modal-body"> 
 
     <p>Some text in the modal.</p> 
 
     </div> 
 
     <div class="modal-footer"> 
 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
 
     </div> 
 
    </div> 
 

 
    </div> 
 
</div>

來源

2016-10-23 05:59:25 arnabkaycee

將CSS添加到AJAX彈出警報

回答

相關問題