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);
});

contains selector - *

starts with - ^

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);});

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

3 个答案: