0

我有一个函数可以隐藏或显示具有给定类名的元素：

$.fn.questionDetails = function(base_element, details_yes_no) {
  var details_element = '.' + base_element + '_details';
  var radio_element = '#' + base_element + '_' + details_yes_no;

  if ($(radio_element).attr('checked')) {
    $(details_element).show();
  } else {
    $(details_element).hide();
  }
}

我想附加/绑定此函数，以便在加载页面和更改给定单选按钮组时使用两个参数调用它。目前我正在使用以下代码来完成此操作：

$(function() {
  // $.fn.questionDetails defined here, in same scope

  $.fn.questionDetails('question1', 'yes');
  $('input:radio[name=question1]').change().questionDetails('question1', 'yes');
}

第一个函数调用工作正常 - 加载页面时，question1_details 面板将显示或隐藏。但是，当我更改选择了哪个单选按钮时，该函数似乎没有被正确调用，当我将 change() 行修改为这样时它也不起作用：

$('input:radio[name=question1]').change($.fn.questionDetails('question1', 'yes'));

我希望能够说“在页面加载时以及给定的单选按钮组更改时使用这些参数调用此函数”，并且重复次数最少。解决此问题的最佳方法是什么？我对 jQuery 比较陌生，所以我可能从一开始就以“错误”的方式做事。

编辑：最初应该提到这一点 - 我使用的是 jQuery 1.7.1。

4

4 回答 4

1

如果要将调用分配给将参数（事件除外）传递给事件处理程序的函数，则需要将该调用包装在匿名函数中，如下所示：

$('input:radio[name=question1]').change(function() {
    $.fn.questionDetails('question1', 'yes')
});

为什么？因为该change()函数期望将函数引用传递给它。当你这样做时，change($.fn.questionDetails('question1', 'yes'))你将调用结果传递$.fn.questionDetails('question1', 'yes')给函数，而不是函数引用。

于 2012-08-06T09:50:02.897 回答
1

我会尝试这样的事情：

$('input:radio[name=question1]').change(function(ev) {
    ev.preventDefault();
    $.fn.questionDetails('question1', 'yes');
});

如果您需要动态决定传递给回调的参数，我会触发一个自定义事件：

$('input:radio[name=question1]').change(function(ev) {
    ev.preventDefault();
    var param1 = // A param you'd like to pass to the callback
    var param2 = // Another param
    $(this).trigger('mycustomevent', [param1, param2]);
});

之后，您可以绑定自定义事件，该事件将在您的输入更改时触发，访问参数如下：

$('input:radio[name=question1]').on('mycustomevent', function(ev, param1, param2){
    $.fn.questionDetails(param1, param2);
});

编辑：

正如您在jQuery 文档中看到的，触发器函数允许您包含一组参数，这些参数将传递给回调函数。

我猜你正在使用 jQuery 1.7 或更高版本。如果不是这种情况，则必须使用bindorlive函数而不是on附加事件。

于 2012-08-06T09:51:32.913 回答
0

首先，如果您使用的是 jquery 1.7.*，请change()尝试使用该函数而不是函数。on()如果您使用的是早期版本，请使用bind()或live()。

如果您确实想使用 change()，则不要将该函数作为参数传递给 change。相反，请使用匿名函数，然后在该匿名函数中调用您的函数。

于 2012-08-06T09:53:19.043 回答
0

试试这个

$.fn.questionDetails = function(base_element, details_yes_no) {
  var details_element = '.' + base_element + '_details';
  var radio_element = '#' + base_element + '_' + details_yes_no;

    $(radio_element).change(function(){
        $(details_element).toggle();
    });
}
于 2012-08-06T10:01:55.443 回答