Question

如何在TestShortName中获取所有选中的复选框文本和存储？例如，如果检查它们并存储在TestShortName变量中，我需要存储10个Panel和TCA。

<div id="cf_2684376_div">
        <div style="overflow:hidden">
            <label style="display:inline-block;width:33%;float:left;padding:0px" for="cf_2684376_0">
                <input type="CheckBox" value="10 Panel (AMP,COC,OPI,PCP,THC,?)" id="cf_2684376_0" name="cf_2684376" checked="" title="" onclick="StoreNames()">10 Panel<input type="hidden" value="Z1h8dUNLU1l5dkFgB1kxR0t@Rn9fcnl3DFNXawMHOAIDBgI~" name="sec_cf_2684376">
            </label>
            <label style="display:inline-block;width:33%;float:left;padding:0px" for="cf_2684376_1">
                <input type="CheckBox" value="5 Panel (AMP,COC,OPI,PCP,THC)" id="cf_2684376_1" name="cf_2684376" title="" onclick="StoreNames()">5 Panel<input type="hidden" value="Z1h8dUNLU1l5dkFgB1kxR0t@Rn9fcnl3DFNXawMHOAIDBgI~" name="sec_cf_2684376">
            </label>
            <label style="display:inline-block;width:33%;float:left;padding:0px" for="cf_2684376_2">
                <input type="CheckBox" value="7 Panel (AMP,COC,OPI,PCP,THC,?)" id="cf_2684376_2" name="cf_2684376" title="" onclick="StoreNames()" disabled="">7 Panel<input type="hidden" value="Z1h8dUNLU1l5dkFgB1kxR0t@Rn9fcnl3DFNXawMHOAIDBgI~" name="sec_cf_2684376">
            </label>
        </div>
        <div style="overflow:hidden">
            <label style="display:inline-block;width:33%;float:left;padding:0px" for="cf_2684376_3">
                <input type="CheckBox" value="Amphetamine" id="cf_2684376_3" name="cf_2684376" title="" onclick="StoreNames()" disabled="">AMP<input type="hidden" value="Z1h8dUNLU1l5dkFgB1kxR0t@Rn9fcnl3DFNXawMHOAIDBgI~" name="sec_cf_2684376">
            </label>
            <label style="display:inline-block;width:33%;float:left;padding:0px" for="cf_2684376_4">
                <input type="CheckBox" value="Barbiturate" id="cf_2684376_4" name="cf_2684376" title="" onclick="StoreNames()" disabled="">BAR<input type="hidden" value="Z1h8dUNLU1l5dkFgB1kxR0t@Rn9fcnl3DFNXawMHOAIDBgI~" name="sec_cf_2684376">
            </label>
            <label style="display:inline-block;width:33%;float:left;padding:0px" for="cf_2684376_5">
                <input type="CheckBox" value="Breath Alcohol Test" id="cf_2684376_5" name="cf_2684376" title="" onclick="StoreNames()" disabled="">BAT<input type="hidden" value="Z1h8dUNLU1l5dkFgB1kxR0t@Rn9fcnl3DFNXawMHOAIDBgI~" name="sec_cf_2684376">
            </label>
        </div>
        <div style="overflow:hidden">
            <label style="display:inline-block;width:33%;float:left;padding:0px" for="cf_2684376_18">
                <input type="CheckBox" value="Phencyclidine" id="cf_2684376_18" name="cf_2684376" title="" onclick="StoreNames()" disabled="">PCP<input type="hidden" value="Z1h8dUNLU1l5dkFgB1kxR0t@Rn9fcnl3DFNXawMHOAIDBgI~" name="sec_cf_2684376">
            </label>
            <label style="display:inline-block;width:33%;float:left;padding:0px" for="cf_2684376_19">
                <input type="CheckBox" value="Propoxyphene" id="cf_2684376_19" name="cf_2684376" title="" onclick="StoreNames()" disabled="">PPX<input type="hidden" value="Z1h8dUNLU1l5dkFgB1kxR0t@Rn9fcnl3DFNXawMHOAIDBgI~" name="sec_cf_2684376">
            </label>
            <label style="display:inline-block;width:33%;float:left;padding:0px" for="cf_2684376_20">
                <input type="CheckBox" value="Tricyclic antidepressant" id="cf_2684376_20" name="cf_2684376" title="" onclick="StoreNames()" disabled="">TCA<input type="hidden" value="Z1h8dUNLU1l5dkFgB1kxR0t@Rn9fcnl3DFNXawMHOAIDBgI~" name="sec_cf_2684376">
            </label>
        </div>
    </div>

我的代码：

function StoreNames(){  
var TestShortName = '';     
$(':checkbox[id^=cf_2684376]:checked').each(function(){                 
    TestShortName != '' ? TestShortName += $(this).next().text() + ';' : TestShortName = $(this).next().text() + ';';       
});         
$('#cf_2684387').val(TestShortName);

}

Answer 1

假设您希望标签元素的文本与输入相关联：

function StoreNames() {
     var shortNames = $('input[type="checkbox"]:checked').map(function(){
         return $(this).parent().text();
     }).get(),
         shortNamesString = shortNames.join(', ') + '.';

     $('#cf_2684387').val( shortNamesString );
}

// call the function with:
$('input[type="checkbox"]').on('change', StoreNames);

参考文献：

如何在TestShortName中获取所有选中的复选框文本和存储？

1 个答案: