JQuery 日歷在 ajax 調用后不起作用，但按鈕在那里？

Question

我在這里遇到了 JQuery 日歷的問題，它在 ajax 調用后不起作用。 我嘗試了很多選擇，但其中任何一個都有效

這是我的js：

function carregar(metodo, div) {
    var loading = new Image();
    loading.src = "${resource(dir: 'images', file: spinner.gif)}";
    $.ajax({
        url: metodo,
        type: "GET",
        dataType: 'text',
        beforeSend: function () {
            $("#" + div).html(loading);
        },
        success: function (data) {
            $("#" + div).html(data);

        }
    });
}

$(function () {
    $("#nascimento").datepicker({
        showOn: "button",
        buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
        buttonImageOnly: true
    });
});

這是索引，我在其中調用 ajax 函數：

<%@ page contentType="text/html;charset=UTF-8" %>
<html>
    <head> 
        <meta name="layout" content="main" />
        <title>Cadastrar Aluno</title>
    </head>
    <body>                
        <input type="button" value="Novo"  onClick="carregar('/aluno/novo', 'divForm')"/> 
        <input type="button" value="Pesquisar"  onClick="carregar('/aluno/pesquisar', 'divForm')"/> 


    <div id="divForm">        
        <g:render template="form"></g:render>
        </div>       
    </body>
</html>

這是我的表單模板：

<asset:javascript src="application.js"/> 
<g:uploadForm controller="aluno" action="salvar">    
    //other fields
    <label>Data de Nascimento:</label>    
    <input type="text" name="nascimento" id="nascimento" required="true" value="<g:formatDate format="dd-MM-yyyy" date="${aluno?.nascimento}"/>"/><br>           
    //other fields
    <input type="submit" value="Salvar"/>
    <input type="button" name="btnCancelar" value="Cancelar"/> 
    <input type="hidden" name="id" value="${aluno?.id}">    
</g:uploadForm>

如果我把

<script type="text/javascript">
    $(function() {
        $( "#nascimento" ).datepicker();
    });
</script>

在模板中，ir 工作一次，如果我在重新加載頁面后再次加載“表單”模板，則不會。

我試過這個：如果它已經在頁面上，則 ajax 調用后 jquery datepicker 不起作用 ajax 調用后 JQuery datepicker 不起作用 ajax 調用后 jQuery datepicker 不起作用

你們有什么想法嗎？

謝謝！

Answer 1

當您重新加載您的 html 時，您正在銷毀附加了日期選擇器的元素並重新創建它。

因此，您需要在替換 html 后重新初始化日期選擇器，如下所示：

                 success: function (data) {
                    $("#" + div).html(data);
                    $("#nascimento").datepicker('remove').datepicker({
                        showOn: "button",
                        buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
                        buttonImageOnly: true
                    });

                }

JQuery 日歷在 ajax 調用后不起作用，但按鈕在那里？

問題描述

1 個解決方案

解決方案1
1 已采納 2016-10-16 03:05:44

JQuery 日歷在 ajax 調用后不起作用，但按鈕在那里？

問題描述

1 個解決方案

解決方案1 1 已采納 2016-10-16 03:05:44

解決方案1
1 已采納 2016-10-16 03:05:44