Question

在我的ASP.NET项目中，我有一个部分类，我有三个单选按钮。

我有一个部分视图，其中包含以下详细信息，

_PartialTEST.cshtml

@model FreeLance.Web.Models.PArtialTESTModel

@Html.RadioButtonFor(m => m.D1, "true", new { Name = "test1", @id = "g1", @checked = "true" }) @Html.LabelFor(m => m.MSGD1, @Model.V1)
@Html.RadioButtonFor(m => m.D2, "false", new { Name = "test1", @id = "g2" }) @Html.LabelFor(m => m.MSGD2, @Model.V1) 
@Html.RadioButtonFor(m => m.D3, "false", new { Name = "test1", @id = "g3" }) @Html.LabelFor(m => m.MSGD3, @Model.V1)

在另一个视图中使用，

MainTEST.cshtml

<div id="partialDIV">
       @{
           @Html.Partial("_PartialTEST", Model)
       }                           
</div>

我正在使用AJAX重新加载div的内容，用于更新带有新值的单选按钮的事件

$.ajax({
                type: "POST",
                url: href,               
                traditional: true,
                async: false,
                datatype: "html",
                cache: false,
                contentType: 'application/json',
                data: { DID: DID },
                success: function (data) {
                    $('#partialDIV').empty();
                    $('#partialDIV').html(data);
                },
                error: function (arg, data, value) {

                }
            });

它从后面的代码中调用以下代码。

[HttpPost]
        public ActionResult GETRADIOVALUES(string CID)
        {
            TESTModel NewModel = new TESTModel();
            ....
            return PartialView("_DurationDetails",NewModel);
        }

现在它使用新值正确加载单选按钮。

然而，真正的问题是任何Jquery事件都会被调用。

例如

$('#g1').change(function() {
});

甚至，

$("input[name=test1]:radio").change(function () {

});

请帮助我解释为什么这些Jquery事件没有触发，尽管这些ID也可以在View Source中找到。

Answer 1

动态创建的元素需要event delegation。

 $(document).on('change',"input[name=test1]:radio",function () {
     //code here
 });

Answer 2

试试这个

$('#partialDIV').on('change', '#g1', function(){
 ....
});

另请查看.on()

为什么Jquery在Ajax更新后无法触发事件

2 个答案: