创建动态模态但它不起作用

Question

您好我试图触发模式，但它根本不起作用， 我有我的按钮，我使用jquery创建一个动态模式，如果有人有想法，它就不起作用。

＆＃13;

＆＃13;

	
  
  $("#myModal").click(function() {
		 
		
		var MysModel = ' <div class="modal fade" id="myModal" role="dialog">\
	<div id="page-dialog" class="modal-dialog">\
\
		<!-- Modal content-->\
		<div class="modal-content">\
			<div class="modal-header">\
				<button type="button" class="close" data-dismiss="modal">&times;</button>\
				<h3 class="title-modal">tyu</h3>\
			</div>\
			\
			<div id="page-content" class="modal-body">\
				<p>ghuihuighgoghggog</p>\
			</div>\
			<div class="modal-footer">\
				<button type="button" class="btn" data-dismiss="modal">Close</button>\
			</div>\
		</div>\
\
	</div>\
</div>'

＆＃13;

<button class="addweb" data-toggle="modal" data-target="#myModal">Add Website</button>


<div id="sectionModal"></div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

<强> Working fiddle

您不需要附加任何事件，您想要的所有内容都会将模态附加到sectionModal div，如：

$('#sectionModal').append(MysModel);

希望这有帮助。

＆＃13;

＆＃13;

var MysModel = ' <div class="modal fade" id="myModal" role="dialog">\
	<div id="page-dialog" class="modal-dialog">\
		<!-- Modal content-->\
		<div class="modal-content">\
			<div class="modal-header">\
				<button type="button" class="close" data-dismiss="modal">&times;</button>\
				<h3 class="title-modal">tyu</h3>\
			</div>\
			\
			<div id="page-content" class="modal-body">\
				<p>ghuihuighgoghggog</p>\
			</div>\
			<div class="modal-footer">\
				<button type="button" class="btn" data-dismiss="modal">Close</button>\
			</div>\
		</div>\
	</div>\
</div>';

$('#sectionModal').append(MysModel);

$('#open-modal').on('click', function(){
    $('#myModal').modal();
})

＆＃13;

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

<button class="addweb" data-toggle="modal" data-target="#myModal">Add Website</button>

<button type="button" id="open-modal">Open Modal</button>

<div id="sectionModal"></div>

＆＃13;

＆＃13;

＆＃13;