我创建了日期名称 7 个复选框和 1 个隐藏输入类型
。如果用户单击作为复选框的日期名称。然后它们的值打印在输入中。
这是我的代码:
<div class="ml-4">
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="monday" name="days_names" value="Monday">
<label class="custom-control-label" for="monday">Monday</label>
</div>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="tuesday" name="day_name_selector" value="Tuesday">
<label class="custom-control-label" for="tuesday">Tuesday</label>
</div>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="wednesday" name="day_name_selector" value="Wednesday">
<label class="custom-control-label" for="wednesday">Wednesday</label>
</div>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="thursday" name="day_name_selector" value="Thursday">
<label class="custom-control-label" for="thursday">Thursday</label>
</div>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="friday" name="day_name_selector" value="Friday">
<label class="custom-control-label" for="friday">Friday</label>
</div>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="saturday" name="day_name_selector" value="Saturday">
<label class="custom-control-label" for="saturday">Saturday</label>
</div>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="sunday" name="day_name_selector" value="Sunday">
<label class="custom-control-label" for="sunday">Sunday</label>
</div>
</div>
<input type="" class="form-control selected_days_names" name="days_names" />
<script>
$(document).ready(function() {
$("input[name='day_name_selector']").change(function() {
var final = new Array();
$('input[name="day_name_selector"]:checked').each(function(){
var values = $(this).val();
final.push(values);
});
$('.selected_days_names').val(final);
});
});
</script>
问题是,我在输入中获取没有空格的值,如下所示 --> Sunday,Monday,Tuesday
..... 我希望它显示输入中的值,如下所示 -->> 周日、周一、周二
值之间有空格。
如何在值之间获取空格?请帮助我
最佳答案
final
是一个数组,当您调用 .val
时,传递的表达式会自动转换为字符串。当数组转换为字符串时,默认情况下,它将仅通过逗号连接,例如 .join(',')
。如果您想使用其他任何内容(例如逗号和空格)进行连接,则必须明确这样做:
$('.selected_days_names').val(final.join(', '));
还可以考虑使用 []
而不是 new Array()
声明数组:
var final = [];
您还可以考虑使用 .map
一次性构建数组:
var final = $('input[name="day_name_selector"]:checked')
.map(function(){
return $(this).val();
})
.get();
关于javascript - jQuery 中 .push 数组值之间的空格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57868371/