javascript - jquery 函数 - 多个输入 / 1 个函数

Question

我有以下 3 个动作，它们在单击标签时基本上检查单选按钮。有没有办法把这些写成一个函数而不是 3 个单独的函数？

$("input[name='customOrder-qty']").on('click', function() {
    $('#qtyPackage-custom').prop('checked', true);  
 });

$("input[name='customOrder-price']").on('click', function() {
    $('#qtyPackage-custom').prop('checked', true);  
 });

$("input[name='customOrder-name']").on('click', function() {
    $('#qtyPackage-custom').prop('checked', true);  
 });

谢谢你

Answer 1

使用以逗号分隔的选择器

$("input[name='customOrder-qty'], input[name='customOrder-price'] 
                  ,input[name='customOrder-name'] ").on('click', function() { 
      $('#qtyPackage-custom').prop('checked', true);
});

或更好地使用属性包含或以选择器开头

$("input[name*='customOrder']").on('click', function() { 
      $('#qtyPackage-custom').prop('checked', true);
});

包含选择器 -*

以。。开始 -^

Answer 2

有几种方法可以做到：

一种是为事件组合您的选择器，以便您拥有

$("input[name='customOrder-qty'], input[name='customOrder-price'], input[name='customOrder-name']").on('click', function() {
    $('#qtyPackage-custom').prop('checked', true);
});

另一种是将绑定的代码定义为实际的函数，从每个事件绑定中调用函数

$("input[name='customOrder-qty']").on('click', doStuff);

$("input[name='customOrder-price']").on('click', doStuff);

$("input[name='customOrder-name']").on('click', doStuff);

function doStuff()
{
    $('#qtyPackage-custom').prop('checked', true);
}

或者您可以结合这两种方法来获得以下内容

$("input[name='customOrder-qty'], input[name='customOrder-price'], input[name='customOrder-name']").on('click', doStuff);

function doStuff()
{
    $('#qtyPackage-custom').prop('checked', true);
}

Answer 3

为每个输入添加一个通用类名。这使得扩展逻辑变得更加容易。

HTML

<input class="myClass" />

JS

$(".myClass").on('click', function() { $('#qtyPackage-custom').prop('checked', true);});