爲什麼我的模態不會彈出在頁面中？

我有一個應該彈出的模式，當我點擊按鈕。但是，當我點擊按鈕;什麼也沒有發生：爲什麼我的模態不會彈出在頁面中？

繼承人我所做的：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> \t 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
<body> 
 
\t \t <div class = "row text-center"> 
 
    \t \t \t <input class="btn btn-primary" id="submit-button" name="submit-button" type="submit" value="Save"> 
 
    \t \t \t 
 
    \t \t \t <input class="btn btn-danger" id="reset-button" type="reset" value="Reset"> 
 

 

 
\t \t \t <div class="well well-large"> 
 
\t \t \t \t <div id="form-content" class="modal hide fade in" style="display: none;"> 
 
\t \t \t \t \t <div class="modal-header"> 
 
\t \t \t \t \t \t <a class="close" data-dismiss="modal">×</a> 
 
\t \t \t \t \t \t <h3>Add transaction</h3> 
 
\t \t \t \t \t </div> 
 

 
\t \t \t \t \t <div class="modal-body"> 
 
\t \t \t \t \t \t <form class="transaction" name="transaction"> 
 
\t \t \t \t \t \t \t <input type="hidden" name="trans_date" value=<?php echo date("Y-m-d H:i:s");?>><br> 
 
\t \t \t \t \t \t \t 
 
\t \t \t \t \t \t \t <label class="label" for="trans_payment_mode">Payment mode</label><br> 
 
\t \t \t \t \t \t \t <select class="form-control" name="trans_payment_mode" id="payment_mode" class="required"> 
 
\t \t \t \t \t \t \t \t <option value="">Select</option> 
 
\t \t \t \t \t \t \t \t <option value="cash">Cash</option> 
 
\t \t \t \t \t \t \t </select><br> 
 

 
\t \t \t \t \t \t \t <label class="label" for="trans_amt">Transaction amount</label><br> 
 
\t \t \t \t \t \t \t <input type="text" name="trans_amt" class="input-xlarge"><br> 
 

 
\t \t \t \t \t \t \t <label class="label" for="trans_details">Transaction details</label><br> 
 
\t \t \t \t \t \t \t <textarea name="trans_details" class="input-xlarge"></textarea> 
 
\t \t \t \t \t \t \t 
 
\t \t \t \t \t \t \t <input type="hidden" name="trans_cust_id" value=<?php echo $cid;?>><br> 
 
\t \t \t \t \t \t \t <input type="hidden" name="trans_admin_person" value=<?php echo $aid;?>><br> 
 
\t \t \t \t \t \t </form> 
 
\t \t \t \t \t </div> 
 

 
\t \t \t \t \t <div class="modal-footer"> 
 
\t \t \t \t \t \t <input class="btn btn-success" type="submit" value="Send" id="submit_trans"> 
 
\t \t \t \t \t \t <a href="#" class="btn" data-dismiss="modal">Cancel</a> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
\t \t \t </div> 
 

 
    \t \t \t <div id="thanks"> 
 
    \t \t \t \t <p><a data-toggle="modal" href="#add-transaction" class="btn btn-primary">Add Transaction</a></p> 
 
    \t \t \t </div> 
 

 
\t \t </div> 
 
    </body>

我有一個包含附加的交易，這將填充模態上述模式。請幫忙。

來源

2016-01-06 Nevermore

HTTP缺少的add-transactionid：//www.w3schools。 com/bootstrap/bootstrap_modal.asp – j08691

CSS需要一點工作，但您在按鈕中缺少data_target類。使用類模式對話框添加帶有ID和div的div。

也改變了線路

<div id="form-content" class="modal hide fade in" style="display: none;">

到

<div id="modal-content">

其它代碼修改

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

... 

<p><a data-toggle="modal" data-target="#myModal" href="#add-transaction" class="btn btn-primary">Add Transaction</a></p>

你可以看到它在撥弄之下

https://jsfiddle.net/4peLpye5/1/

編輯 - 沒有PHP的JSFiddle

來源

2016-01-06 16:16:48 blairmeister

它工作。謝謝。 – Nevermore

這是幾個問題的組合。

無需爲hide類的模態
無需爲display:none風格上的模態
的模式

來源

2016-01-06 16:18:44

它有助於糾正我的模式。謝謝丹尼爾。 – Nevermore

爲什麼我的模態不會彈出在頁面中？

回答

相關問題