我已经阅读了很多解决方案,我读到我应该使用“on”jquery。但它对我不起作用。
我有一个通常用于日历选择器的字段。我有一个按钮,当我点击它时,一个 div 被重新充电,并添加了一个具有相同 id 的日历选择器功能的字段。 但显然按钮不起作用。在日历选择器上它也不起作用。 我想在 div 中包含按钮和文本字段,并发出 Ajax 请求以继续操作日历选择器。
测试.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="X-UA-Compatible" content="IE=8">
<title>
</title>
<link rel='stylesheet' type='text/css' href='../css/jquery-ui-1.9.2.custom.css'/> <!--Carga los estilos de jquery-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="../js/jquery-ui-1.9.2.custom.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#generateDiv").click(function() {
$.ajax({
type:"POST",
url: "ajax.php"
}).done(function(data) {
$("#divReloaded").html(data);
});
})
$( "#fecha" ).datepicker({ dateFormat: 'yy-mm-dd' });
})
</script>
<!--Fin enlaces-->
</head>
<body>
<div id='divReloaded'>
<input type='text' id='fecha'>
<input type='button' id='generateDiv' value='button' >
</div>
</body>
</html>
ajax.php
<?php
echo "not works jquery :(<br>";
echo "<input type='text' id='fecha'>";
echo "<input type='button' id='generateDiv' value='button' >;"
?>
最佳答案
在评论中讨论后,请参阅以下答案:
$(document).ready(function(){
// Adopted event delegation to make sure dynamically added elements are bound to
$("#divReloaded").on('click', '#generateDiv', function() {
$.ajax({
type:"POST",
url: "ajax.php"
}).done(function(data) {
$("#divReloaded").html(data);
// Moved this inside the done() function so datepicker is re-applied
$("#divReloaded").find("#fecha").datepicker({ dateFormat: 'yy-mm-dd' });
});
});
});
关于javascript - 当执行 ajax 请求以重新加载 div 时,jquery 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34030449/