Question

我正在使用ASP.NET MVC（Razor）和Jquery，我的页面如下所示（简称）。当我第一次加载我的页面一切正常，每个脚本工作，我可以打开datepicker等。但在我从下拉列表中选择后，我的脚本停止工作。返回的结果还可以（服务器端没有问题），这里的内容基本上是我将整个表单发送到服务器端从数据库中填充一些数据并发送回div的内容。我可以以某种方式重新初始化脚本或其他东西，对我来说它看起来像js / jquery“没有注意到”新内容？

<div id="commissionContent">    
 <table>            
        <tr>
            @Html.DropDownListFor(m => m.OfferId, new SelectList(Model.Offers, "Id", "DocumentNo"),
                        "-- Wybierz --", new { id = "selectedOffer" })
        </tr>          
        <tr>
            <td colspan="5">
                @Html.LabelFor(m => m.RealizationDate)<br />
                @Html.TextBoxFor(m => m.RealizationDate, new { id = "CommissionRealizationDate" })
            </td>
            <td></td>
            <td></td>
        </tr>
</div>

@section JavaScript
{
<script type="text/javascript">
    $(function () {
        $('#CommissionRealizationDate').datepicker({
            format: "dd/MM/yyyy",
            autoclose: true
        });

        offerType.init();            
    });

    var offerType = {
        init: function () {
            //this.selectedKind();
            this.selectedOffer();
        },
        selectedOffer: function () {
            $('form').on('change', '#selectedOffer', function () {
                **$.post("ChoosenCommission", $('form').serialize(), function (data) {
                    $("#commissionContent").html(data);**

                    });
        }
    };
  }

我刚注意到ed-X说过同样的事情，它之前没有用过。可能问题是我从服务器整页返回（不仅仅是div内容），它可能搞砸了（有人知道吗？）。

P.S。你们很快我就去喝茶，然后自己回答：P

Answer 1

您必须在替换的html片段中重新初始化datepicker和其他可能的事件。

var init = function () {
    $('#CommissionRealizationDate').datepicker({
        format: "dd/MM/yyyy",
        autoclose: true
    });

    offerType.init();            
}

$(init);

var offerType = {
    init: function () {
        //this.selectedKind();
        this.selectedOffer();
    },
    selectedOffer: function () {
        $('form').on('change', '#selectedOffer', function () {
            $.post("ChoosenCommission", $('form').serialize(), function (data) {
                $("#commissionContent").html(data);
                init()
                });
    }
};

}

JavaScript / Jquery - 调用html（）后脚本不起作用

1 个答案: