将多个点击功能与加载事件合并？

Question

我可能是个白痴，但是，是否可以合并以下内容：

$(function () {
    $("#but1").click(function(){
        $("#RightPanel").load("page1.html");
    });
    $("#but2").click(function(){
        $("#RightPanel").load("page2.html");
    });    
});

我在考虑 if/else 语句，但无法弄清楚如何使用加载事件构建它？

Answer 1

在按钮上添加自定义 data-* 属性，并使用通用的 class:

<button class="loader" data-page="page1.html">Button 1</button>
<button class="loader" data-page="page2.html">Button 2</button>

和 JS：

$(".loader").click(function() {
    var page = $(this).data("page");
    $("#RightPanel").load(page);
});

如果您需要使用 if else - 您可以这样做：

$("#but1, #but2").click(function(){
    if (this.id == "but1") {
        $("#RightPanel").load("page1.html");
    } else if (this.id == "but2") {
        $("#RightPanel").load("page2.html");
    }
});

将多个点击功能与加载事件合并？

Merging multiple click functions with load events?

ajax

jquery

click

onclick