Question

我目前正在创建一个MVC4 Web应用程序，我似乎遇到了一个奇怪的问题。我创建了一个无序列表，其中包含一些列表项，以及我将能够单击的各自的锚标记，它们将返回相应的 / CONTROLLER / ACTION 视图。

    <div>
        <ul>
            <li>
                <a class="ajax" href="/Test/One"></a>
            </li>
            <li>
                <a class="ajax" href="/Test/Two"></a>
            </li>
            <li>
                <a class="ajax" href="/Test/Three"></a>
            </li>
            <li>
                <a class="ajax" href="/Test/Four"></a>
            </li>
        </ul>
   </div>

   <div id="body">
   </div>

然后我创建了一些jQuery，当你点击其中一个锚标签，寻找一个“ajax”类时调用，如果要点击锚标签，它将运行另一个名为GetContent的函数，通过锚标记的 HREF 值，将用作ajax调用的路径。

$(document).ready(function () {
    $(".ajax").click(function () {
        var path = $(this).attr("href");
        GetContent(path);
    });
});

function GetContent(path) {

    $.ajax({
        url: path,
        type: 'POST',
        async: false,
        success: function (result) {
            $("#body").html(result);
        }
    });
}

我听说过你可以打电话的功能，我相信叫做 preventDefault 。我发现我不确定何时调用此preventDefault来覆盖锚标记的点击。

我确实试过把它放到几个地方，但没有运气......我发现此刻我能够点击任何一个锚标签，并且默认动作发生，它只是返回整个网站加载新视图。但是，如果我在谷歌浏览器开发工具中打开控制台，并调用函数GetContent，通过我期望的路径，它将调用该函数，返回ajax，并更新我的网页。

如果有人能指出我应该调用那个很棒的preventDefault函数。

Answer 1

preventDefault是event对象的方法。您将event对象的引用作为click事件处理程序的第一个参数...

$(".ajax").click(function (event) {
    var path = $(this).attr("href");
    GetContent(path);
    event.preventDefault();
});

在DOM元素上调用preventDefault

1 个答案: