创建一个供多个控件使用的全局jQuery函数

我有多个控件，不同类型的控件具有相同的行为。 如何使用单个函数重用相同的行为。现在，我为它们中的每一个都有一个函数。这个函数工作正常，但我想找到一种方法，如果我们可以用一个全局函数替换这个函数并重用它

$(document).ready(function () {

    var threechecked = false;
    var fourchecked = false;

    $('#<%=CheckBoxList1.ClientID%> input:checkbox').click(function () {

        var currentIdone = 'Unknown';
        var currentId = $(this).next().html();
        if (currentId == currentIdone) {

            if (threechecked) {

                $("#<%=CheckBoxList1.ClientID%> input").removeAttr('disabled');
                threechecked = false;
                return;
            }
            else {
                $("#<%=CheckBoxList1.ClientID%> input").attr('checked', false);
                $(this).attr('checked', true);
                $('#<%=CheckBoxList1.ClientID%> input:not(:checked)').attr('disabled', 'disabled');
                threechecked = true;
            }


        }

    });


    $('#<%=CheckBoxList2.ClientID%> input:checkbox').click(function () {


        var currentIdone = 'Unknown';
        var currentId = $(this).next().html();
        if (currentId == currentIdone) {

            if (fourchecked) {

                $("#<%=CheckBoxList2.ClientID%> input").removeAttr('disabled');
                checked = false;
                return;
            }
            else {
                $("#<%=CheckBoxList2.ClientID%> input").attr('checked', false);
                $(this).attr('checked', true);
                $('#<%=CheckBoxList2.ClientID%> input:not(:checked)').attr('disabled', 'disabled');
                fourchecked = true;
            }


        }

});

$（文档）.ready（函数（）{
var=false；
var-fourchecked=false；
$（“#输入：复选框”）。单击（函数（）{
var currentIdone='未知'；
var currentId=$（this.next（）.html（）；
if（currentId==currentIdone）{
如果（已选中）{
$（“#输入”）.removeAttr（'disabled'）；
三次检查=错误；
返回；
}
否则{
$（“#输入”）.attr（'checked'，false）；
$（this.attr（'checked'，true）；
$（'#输入：未（：选中））.attr（'disabled'，'disabled'）；
三次检查=正确；
}
}
});
$（“#输入：复选框”）。单击（函数（）{
var currentIdone='未知'；
var currentId=$（this.next（）.html（）；
if（currentId==currentIdone）{
如果（勾选）{
$（“#输入”）.removeAttr（'disabled'）；
选中=错误；
返回；
}
否则{
$（“#输入”）.attr（'checked'，false）；
$（this.attr（'checked'，true）；
$（'#输入：未（：选中））.attr（'disabled'，'disabled'）；
fourchecked=true；
}
}
});

---

有没有一种方法可以创建单个函数并通过每个控件重用相同的函数？

有些人可能会认为将函数附加到全局

窗口

对象可能有点奇怪，但实际上它与全局函数是一样的

window.foo = function() {
    /* Your code here */
};

然后，您可以在DOM就绪时执行此函数：

$(document).ready(window.foo);

---

我为你的问题做了一个解决方案的例子。如果你愿意，我把它放进去

假设您有以下HTML：

<div class="unknownSelectable">
  <input type="checkbox" value="0" name="Anything" id="Anything1" />
  <label for="Anything1">Unknown</label>
  <input type="checkbox" value="0" name="Anything" id="Anything2" />
  <label for="Anything2">Label 1</label>
  <input type="checkbox" value="0" name="Anything" id="Anything3" />
  <label for="Anything3">Label 2</label>
  <input type="checkbox" value="0" name="Anything" id="Anything4" />
  <label for="Anything4">Label 3</label>
</div>
<h1>Select</h1>
<div class="unknownSelectable">
  <input type="checkbox" value="0" name="AnotherAnything" id="AnotherAnything1" />
  <label for="AnotherAnything1">Unknown</label>
  <input type="checkbox" value="0" name="AnotherAnything" id="AnotherAnything2" />
  <label for="AnotherAnything2">Label 1</label>
  <input type="checkbox" value="0" name="AnotherAnything" id="AnotherAnything3" />
  <label for="AnotherAnything3">Label 2</label>
  <input type="checkbox" value="0" name="AnotherAnything" id="AnotherAnything4" />
  <label for="AnotherAnything4">Label 3</label>    
</div>

我将事件从单击更改为更改，因为无论是单击输入还是单击标签都无关紧要。我还将其包装在div元素中，但不管怎样，您也可以将其包装在另一个HTML元素中

---

对不起，我的英语，如果我犯了一些英语错误，请随意重写并改进。

我想这是有效的方法

$( ".unknownSelectable input" ).change(function( event ){

  var labelSelected = $( this ).next().html();

  if ( labelSelected == "Unknown" ) {
    var $siblings = $( this ).siblings( "input[type='checkbox']" );

    if( $( this ).is( ":checked" ) )
    {
      $siblings.prop( "checked", false );
      $siblings.attr( "disabled", "disabled" );    
    }
    else{
      $siblings.removeAttr( "disabled" );
    }

  }

});

---

为什么不把它做成一个jQuery插件呢？你能在这里显示呈现的HTML吗？不是ASPX代码，而是呈现的HTML。我不确定你的意思，这是一个ASPX控件，我必须实现为一个ASPX页面。我还看到一件事，它在我的ASPX页面中不起作用，而在HTML页面中起作用。这不是一个HTML页面，它是giv每次加载页面时都会给我一个脚本错误，说明对象不支持此属性或方法。jquery02.0.3.min.js。它是否仅适用于HTML5。我正在SharePoint 2010可视化Web部件中工作以实现此功能。我知道，我已经使用了很多aspx和JQuery。您的复选框列表是否有一些隐藏事件（代码隐藏事件）？我有，但我不能使用回发，所以在Chrome或Firefox控制台中没有看到CheckboxList后面的事件吗？如果是，会出现什么错误？

$( ".unknownSelectable input" ).change(function( event ){

  var labelSelected = $( this ).next().html();

  if ( labelSelected == "Unknown" ) {
    var $siblings = $( this ).siblings( "input[type='checkbox']" );

    if( $( this ).is( ":checked" ) )
    {
      $siblings.prop( "checked", false );
      $siblings.attr( "disabled", "disabled" );    
    }
    else{
      $siblings.removeAttr( "disabled" );
    }

  }

});