Question

我有一个模态，当我点击按钮时，它会弹出。但是，当我点击按钮时;没有任何反应：

继承人的所作所为：

<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>	
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<body>
		<div class = "row text-center">
 			<input class="btn btn-primary" id="submit-button" name="submit-button" type="submit" value="Save">
 			
  			<input class="btn btn-danger" id="reset-button" type="reset" value="Reset">


			<div class="well well-large">
				<div id="form-content" class="modal hide fade in" style="display: none;">
					<div class="modal-header">
						<a class="close" data-dismiss="modal">×</a>
						<h3>Add transaction</h3>
					</div>

					<div class="modal-body">
						<form class="transaction" name="transaction">
							<input type="hidden" name="trans_date" value=<?php echo date("Y-m-d H:i:s");?>><br>
							
							<label class="label" for="trans_payment_mode">Payment mode</label><br>
							<select class="form-control" name="trans_payment_mode" id="payment_mode" class="required">
								<option value="">Select</option>
								<option value="cash">Cash</option>
							</select><br>

							<label class="label" for="trans_amt">Transaction amount</label><br>
							<input type="text" name="trans_amt" class="input-xlarge"><br>

							<label class="label" for="trans_details">Transaction details</label><br>
							<textarea name="trans_details" class="input-xlarge"></textarea>
							
							<input type="hidden" name="trans_cust_id" value=<?php echo $cid;?>><br>
							<input type="hidden" name="trans_admin_person" value=<?php echo $aid;?>><br>
						</form>
					</div>

					<div class="modal-footer">
						<input class="btn btn-success" type="submit" value="Send" id="submit_trans">
						<a href="#" class="btn" data-dismiss="modal">Cancel</a>
					</div>
				</div>
			</div>

 			<div id="thanks">
 				<p><a data-toggle="modal" href="#add-transaction" class="btn btn-primary">Add Transaction</a></p>
 			</div>

		</div>
  </body>

我有上面的模式包含add-transaction，它将填充一个模态。请帮忙。

Answer 1

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/

编辑 - JSFiddle中没有php

Answer 2

这是几个问题的组合。

不需要模态<{li>上的hide课程
模态

display:none

在模态

id

add-transaction

为什么我的模态没有弹出页面？

2 个答案: