如何在jquery中创建"可重用"函数?

I_m*_*ady 5 javascript jquery parameter-passing

我有一些很好的代码:

function displayVals() {
    var phonevals = $("#bphonesel").val();
    $('#bphone').val(phonevals);
}

$("select").change(displayVals);
displayVals();
Run Code Online (Sandbox Code Playgroud)

我希望能够将其重复用于我网站上的所有其他选择框.所以,我以为我会使用参数来做到这一点.但是,到目前为止,我还是无法正确使用语法.这就是我所拥有的,但它不起作用.任何帮助,将不胜感激.

function displayVals(inputfld, boundfld) {
    var nvenval = $(inputfld).val();
    $(boundfld).val(nvenval);
}

$("select").change(displayVals());
displayVals('#bphonesel', '#bphone');
Run Code Online (Sandbox Code Playgroud)

Chr*_*tow 9

$.fn.displayVals = function(inputfld, boundfld) {
    this.change(function() {
        var nvenval = $(inputfld).val();
        $(boundfld).val(nvenval);
    }
}

$("select").displayVals();
Run Code Online (Sandbox Code Playgroud)

查看有关创作插件jQuery文档以获取更多信息.


jbl*_*ock 5

如果你想让它成为一个 jQuery 函数,就像这样:

$.fn.displayVals = function() {
// Function stuff goes here
});

$('#element').displayVals()
Run Code Online (Sandbox Code Playgroud)

在函数内部,$(this)正如您所期望的那样工作。只需在 docReady 之外定义它,就可以了。话虽如此,看起来您只需要在 .change 事件内的 displayVals() 调用中定义选择器:

$("select").change(displayVals('#bphonesel','#bphone'));
Run Code Online (Sandbox Code Playgroud)

除此之外,我必须查看您的其余代码才能了解可能导致问题的原因。

  • 你不应该在 jQuery 函数中使用 `$(this)`,`this` 已经是一个扩展对象。 (2认同)