Zepto活動

Question

我是Zepto的新手，我正在嘗試做一些非常簡單的事情，但是似乎我無法以任何方式做到這一點。 我正在嘗試將一個函數綁定到Zepto中的click事件，但是即使未觸發該事件，該函數也會被執行...

這是我的js文件的內容：

$(document).ready(function() {

    if (!$('.page').hasClass('.current')) {
        $('#home').addClass('current');
        $('.page .content').css('display', 'none');
    $('#home .content').css('display', 'block');
}

$('#menu-trigger').on('click', switchPage('search', 'fade'));

function switchPage(pageID,switchType) {
    oldPageID = '#' + $('.page.current').attr('id');
    newPageID = '#' + pageID;
    if(switchType =='fade') { // Fade Effect
        // $(oldPageID).hide();
        alert('done');
    }
}
});

問題是該函數在我重新加載html后立即執行，而不必等待'click'事件。

Answer 1

當您僅使用switchPage('search', 'fade') JS評估該函數並嘗試設置其返回值時，請改用此函數。

    $('#menu-trigger').on('click', function () { switchPage('search', 'fade') });

如果您使用帶有out參數的函數，則可以使用

    $('#menu-trigger').on('click', switchPage );

Answer 2

區別在於指定哪個對象將用作回調，以及使函數實際執行，並將返回值指定為回調。

您的代碼應為：

$('#menu-trigger').on('click', switchPage);
function switchPage(pageID,switchType) {
    oldPageID = '#' + $('.page.current').attr('id');
    newPageID = '#' + pageID;
    if(switchType =='fade') { // Fade Effect
        // $(oldPageID).hide();
        alert('done');
    }
}