JavaScript和ajax.actionlink

时间:2013-06-18 21:43:40

标签: jquery asp.net-mvc asp.net-mvc-3

我正在开发一个mvc应用程序, 我有一个显示图像列表的页面,当您将鼠标悬停在图像上时,它只是为图像添加边框,然后我在页面上有一些过滤图像的链接 这些链接是ajax.actionlink。它调用局部视图并使用过滤图像的结果更新页面

然后我放松了我在文件准备就绪中指定的hove效果

 <script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
   <script src="@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script>
     <script src="~/Scripts/jquery-1.7.1.min.js"></script>

 <script type="text/javascript">
             $(function () {
                 $('.ListLi').hover(
                     function () {

                         $(this).children(".img-title").css("border", "3px solid black");
                 },

                 function () {
                     $(this).children(".img-title").css("border", "1px solid black");
                 }

                 );


             });


</script>

这是ajax调用

<ul id="filters" class="option-set clearfix nav nav-pills" data-option-key="filter">

         <li class="active"><a href="#filter" data-option-value="*" class="selected">Show All</a></li>

@foreach (var item in Model) {

     @Ajax.ActionLink(@item.name.ToString(),"ListOfWorks","work",new { id=item.id },new AjaxOptions{
                     UpdateTargetId="List",
                      InsertionMode=InsertionMode.Replace,
                      HttpMethod="Get"
       },null)
}

</ul> 

1 个答案:

答案 0 :(得分:0)

Success

中添加Ajax Options回调
AjaxOptions
{
        UpdateTargetId = "List",
        InsertionMode  = InsertionMode.Replace,
        HttpMethod     = "Get",
        OnSuccess      = "myCallback"
}

您可以在DOM ready。

中重复使用此功能
function myCallback() {
    $('.ListLi').hover
    (
        function () {
            $(this).children(".img-title").css("border", "3px solid black");
        },

        function () {
            $(this).children(".img-title").css("border", "1px solid black");
        }
    );
}