避免在View的OnClick事件上回发

时间:2015-07-24 13:36:44

标签: jquery asp.net-mvc asp.net-mvc-3 asp.net-mvc-4 partial-views

我有两个观点如下:

Index.cshtml

    <p>
       @Html.ActionLink("Create New", "Create", "Owner ", new { id = "lnkCreate" })
    </p>

 @section JavaScript {
        <script type="text/javascript" src="@Url.Content("/Scripts/Owner.js")"></script>

    }

Create.cshtml

 <div>
            @Html.ActionLink("Back", "Index", "Owner", new { id = "lnkBack" })
        </div>

@section JavaScript {
    <script type="text/javascript" src="@Url.Content("/Scripts/Owner.js")"></script>

}

脚本&gt;&gt; Owner.js

$(document).ready(function () {


   $('#lnkBack').click(function (e) {                  // not working
        alert('hello')
        e.preventDefault();
        $.ajax({
            url: '/Owner/Index',
            dataType: "html",
            success: function (data) {
                //$('#divContent').hide();
                //$('#divGrid').html(data);
            }
        });

    });

    $('#lnkCreate').click(function (e) {                 //working fine

        e.preventDefault();
        $.ajax({
            url: '/Owner/Create',
            dataType: "html",
            success: function (data) {
               // $('#divGrid').hide();
               // $('#divContent').html(data);
            }
        });

    });

});

每当我点击&#34;创建新的&#34;我想要实现的目标链接它正在编码没有任何回发。但当我点击&#34;返回&#34;在同一个控制器下的不同视图的链接它正在进行回发而不是像在脚本代码中编写的那样点击事件。

1 个答案:

答案 0 :(得分:0)

试试这个:

$(document).ready(function () {

 function bindClicks(){
   $('#lnkBack').click(function (e) {                  
        // alert('hello')
        e.preventDefault();
        $.ajax({
            url: '/Owner/Index',
            dataType: "html",
            success: function (data) {
                //$('#divContent').hide();
                //$('#divGrid').html(data);
                bindClicks();
            }
        });

    });

    $('#lnkCreate').click(function (e) {                 
        e.preventDefault();
        $.ajax({
            url: '/Owner/Create',
            dataType: "html",
            success: function (data) {
               // $('#divGrid').hide();
               // $('#divContent').html(data);
               bindClicks();
            }
        });

    });
 }

bindClicks();

});

基本上,您需要在通过ajax获取内容后重新绑定click()功能。

加载页面时运行的jQuery函数与通过ajax添加的任何新内容无关。每次在页面上添加新内容时,您都必须再次运行相同的功能(如果此内容具有一些jQuery功能,例如单击绑定)。一个好的地方就是ajax&#34;成功&#34; (新内容已完全添加到页面中)