Question

我有这两个函数，并希望1用指定的变量执行另一个函数：

function ckbmovestate() {
    $(this).css("-webkit-transform", "translate(53px, 0px)")

    };

function initcheckbox(){
    var togglebox = "<div class='toggle_box'><div class='switch'></div></div>";
    $('input[type=checkbox]').css('display','none');
    $('fieldset[data-input-type=checkbox]').append(togglebox);
    $('fieldset:has(:checkbox:checked)').each(function(){
        $(this).find('.switch').attr('data-state', 'on');
        ckbmovestate($(this))
    });
    $('fieldset:has(:checkbox:checked)')
    $('fieldset:not(:has(:checkbox:checked))').find('.switch').attr('data-state', 'off');

};

正如您可能猜到的，这不起作用。问题是为什么？你能给我一个关于变量处理的快速课程吗？谢谢你们，我知道你们是最棒的！

Answer 1

最简单的选择是定义函数以获取参数：

function ckbmovestate(element) {
    $(element).css("-webkit-transform", "translate(53px, 0px)")
}

然后，您可以使用代码中的ckbmovestate(this)来调用此内容。

如果您确实希望能够在调用函数时使用this关键字，则可以执行此操作。这里不值得，但有时候你想要这样做。为此，您需要使用call或apply。在这里，两者都有效：

ckbmovestate.call(someElement);

这会将someElement的值发送到ckbmovestate。在ckbmovestate内，您可以使用关键字this来访问该值。所以在上面的代码中，以下调用将起作用：

ckbmovestate.call(this);

然而，这几乎肯定会使这种情况过于复杂 - 定义参数要容易得多。

Answer 2

因为您不接受ckbmovestate中的参数

如果你不想改变太多的代码，你的ckbmovestate函数应如下所示：

function ckbmovestate(element){
   element.css("-webkit-transform", "translate(53px, 0px)");
}

如果你经常使用ckbmovestate函数，我建议你制作自己的小插件，你喜欢这样;

$.fn.ckbmovestate = function(){
$(this).each(function(){
   $(this).css("-webkit-transform", "translate(53px, 0px)");
});
}

，在jquery问题代码中的每个循环中，你可以这样写：

 $('fieldset:has(:checkbox:checked)').each(function(){
        $(this).find('.switch').attr('data-state', 'on')
               .ckbmovestate();
    });

Answer 3

更改功能以使用参数。

function ckbmovestate( x ) {
    x.css("-webkit-transform", "translate(53px, 0px)")
};

将变量发送到另一个函数

3 个答案: