如果调整复选框值,我将如何更新文本框?
例如,如果选中复选框1到6时文本框显示1-6,并且未选中3,我希望文本框说1,2,4-6或1,2,4,5,6。我该怎么做呢
这是我的代码到目前为止,我的jsFiddle可以在http://jsfiddle.net/dYsg7/4/找到:
// slider
$(".slider_weekRange2").slider({
range: true,
min: 1,
max: 15,
step: 1,
values: [1, 12],
slide: function (event, ui) {
$(".search_weekRange2").val(ui.values[0] + "-" + ui.values[1]);
$('input:checkbox[name="weeks_1"]').prop("checked", false);
$('input:checkbox[name="weeks_1"]').slice(ui.values[0] - 1, ui.values[1]).prop("checked", true);
}
});
$(".search_weekRange2").val($(".slider_weekRange2").slider("values", 0) +
"-" + $(".slider_weekRange2").slider("values", 1));
// weeks
// no weeks
$('.week_none').click(function () {
$('input:checkbox[name="weeks_1"]').prop("checked", false);
$(".search_weekRange2").val('');
});
// all week
$('.week_all').click(function () {
$('input:checkbox[name="weeks_1"]').prop("checked", true);
$(".search_weekRange2").val('1-15');
});
// weeks 1-12
$('.week_term').click(function () {
$('input:checkbox[name="weeks_1"]').prop("checked", false);
$('input:checkbox[name="weeks_1"]').slice(0, 12).prop("checked", true);
$(".search_weekRange2").val('1-12');
});
// odd weeks
$('.week_odd').click(function () {
$('input:checkbox[name="weeks_1"]').prop("checked", false);
$('input:checkbox[name="weeks_1"]:even').prop("checked", true);
$(".search_weekRange2").val('1,3,5,7,9,11,13,15');
});
// even weeks
$('.week_even').click(function () {
$('input:checkbox[name="weeks_1"]').prop("checked", false);
$('input:checkbox[name="weeks_1"]:odd').prop("checked", true);
$(".search_weekRange2").val('2,4,6,8,10,12,14');
});
答案 0 :(得分:3)
这是你修改过的小提琴:http://jsfiddle.net/dYsg7/5/
这是我添加的代码:
$('input:checkbox').click(function () {
var s = [];
$('input:checkbox').each(function () {
if (this.checked) {
s.push($(this).next().text());
}
});
$(".search_weekRange2").val(s.join(','));
});
单击复选框时,请检查每个复选框,并将其标签的文本(之后的下一个项目)添加到数组(如果已选中)。收集所有选中的复选框后,用逗号将它们全部连接起来,然后将其分配给输出。
答案 1 :(得分:0)
如何在复选框中添加onChange侦听器并调用将创建字符串并更新复选框的函数?