我有一个带有 3 个复选框数组的表单 - 鹰嘴豆泥 []、蛋黄酱 []、果酱 []。在下面的jQuery函数中,当检查所需数量的复选框时,将禁用其余的复选框(当前可行)。
问题:当它们被选中时,我也试图将选中的复选框值转换为文本字段值,hummus1、hummus2、mayo1、jam1 - (这些文本字段将更改为隐藏字段以便在实时发布时发布)。2 个hummus 函数不起作用,mayo 和 jam 函数只返回数组的第一个复选框值,无论是否选中。
非常感谢这里的任何帮助。
jQuery(function one(){
var max = 2;
var checkboxes = $('input[type="checkbox"][name="hummus[]"]');
checkboxes.change(function(){
var current = checkboxes.filter(':checked').length;
checkboxes.filter(':not(:checked)').prop('disabled', current >= max);
// Trying to insert the 2 checked hummus values from the hummus array into text fields
$('input[type="text"][name="hummus1"]').val($('input[type="checkbox"][name="hummus[0]"]').val());
$('input[type="text"][name="hummus2"]').val($('input[type="checkbox"][name="hummus[1]"]').val());
});
});
jQuery(function two(){
var max = 1;
var checkboxes = $('input[type="checkbox"][name="mayo[]"]');
checkboxes.change(function(){
var current = checkboxes.filter(':checked').length;
checkboxes.filter(':not(:checked)').prop('disabled', current >= max);
// Trying to insert the single checked mayo value into the mayo1 text field
$('input[type="text"][name="mayo1"]').val($('input[type="checkbox"][name="mayo[]"]').val());
});
});
jQuery(function three(){
var max = 1;
var checkboxes = $('input[type="checkbox"][name="jam[]"]');
checkboxes.change(function(){
var current = checkboxes.filter(':checked').length;
checkboxes.filter(':not(:checked)').prop('disabled', current >= max);
// Trying to insert the single checked jam value into the jam1 text field
$('input[type="text"][name="jam1"]').val($('input[type="checkbox"][name="jam[]"]').val());
});
});
jQuery(function uncheck() {
// Uncheck all checkboxes on page load
$(':checkbox:checked').removeAttr('checked');
})
的HTML:
<form id="orderProductForm219" name="orderProductForm219" method="post">
<b>Select any TWO Hummus from this list.</b>
<br /><br />
<input type="checkbox" name="hummus[]" value="chilli hummus with harissa"> chilli hummus with harissa<br />
<input type="checkbox" name="hummus[]" value="cumin & lemon oil hummus"> cumin & lemon oil hummus<br />
<input type="checkbox" name="hummus[]" value="garlic hummus"> garlic hummus<br />
<input type="checkbox" name="hummus[]" value="pumpkin, fetta & dukkah hummus"> pumpkin, fetta & dukkah hummus
<br /><br />
<b>and include ONE Mayonnaise from this list.</b>
<br /><br />
<input type="checkbox" name="mayo[]" value="aioli"> aioli<br />
<input type="checkbox" name="mayo[]" value="saffron, dill & mustard mayonnaise"> saffron, dill & mustard mayonnaise<br />
<input type="checkbox" name="mayo[]" value="wasabi mayonnaise"> wasabi mayonnaise<br />
<input type="checkbox" name="mayo[]" value="chilli mayonnaise"> chilli mayonnaise<br />
<input type="checkbox" name="mayo[]" value="caesar dressing"> caesar dressing<br />
<input type="checkbox" name="mayo[]" value="smoked aioli"> smoked aioli
<br /><br />
<b>and include ONE Relish, Jam, Curd or Pesto from this list.</b>
<br /><br />
<input type="checkbox" name="jam[]" value="middle eastern red pepper & pomegranate pesto"> middle eastern red pepper & pomegranate pesto<br />
<input type="checkbox" name="jam[]" value="aubergine relish"> aubergine relish<br />
<input type="checkbox" name="jam[]" value="beetroot relish"> beetroot relish<br />
<input type="checkbox" name="jam[]" value="tomato & chilli relish"> tomato & chilli relish<br />
<input type="checkbox" name="jam[]" value="taramasala"> taramasala<br />
<input type="checkbox" name="jam[]" value="preserved lemons"> preserved lemons<br />
<input type="checkbox" name="jam[]" value="rasberry & white chocolate jam"> rhubarb, rasberry & white chocolate jam<br />
<input type="checkbox" name="jam[]" value="apricot, saffron & vanilla bean jam"> apricot, saffron & vanilla bean jam<br />
<input type="checkbox" name="jam[]" value="apricot & armaretto jam"> apricot & armaretto jam<br />
<input type="checkbox" name="jam[]" value="rose water & cardamon marmalade"> rose water & cardamon marmalade<br />
<input type="checkbox" name="jam[]" value="whiskey & ginger marmalade"> whiskey & ginger marmalade<br />
<input type="checkbox" name="jam[]" value="lemon curd"> lemon curd<br />
<input type="checkbox" name="jam[]" value="Lemon & passion fruit curd"> lemon & passion fruit curd
<br />
<input type="hidden" name="productId" value="219" />
<input type="hidden" name="productTitle" value="Gift Pack" />
<input type="hidden" name="price" value="1.00" />
<input type="text" name="hummus1" id="hummus1" value="" />
<input type="text" name="hummus2" id="hummus2" value="" />
<input type="text" name="mayo1" id="mayo1" value="" />
<input type="text" name="jam1" id="jam1" value="" />
</form>