选中复选框后变量未更新
Variable not updating after selecting checkbox
好的,所以我有一个基本的复选框列表,如下所示:
<div class="control-group">
<div class="controls">
<label class="checkbox">
<input type="checkbox" name="lowercase" id="lowercase" checked="true"> lowercase letters
</label>
<label class="checkbox">
<input type="checkbox" name="uppercase" id="uppercase"> UPPERCASE LETTERS
</label>
<label class="checkbox">
<input type="checkbox" name="digits" id="digits"> Digits 0 to 9
</label>
<label class="checkbox">
<input type="checkbox" name="symbols" id="symbols"> Punctuation / Symbols <small>(e.g. % $ & * ! ... ) </small>
</label>
<label class="checkbox">
<input type="checkbox" name="ascii" id="ascii"> All ASCII Characters
</label>
</div>
</div>
当每个复选框都被选中时,它所在的表单通过ajax提交到calc.php。如果复选框被选中或未被选中,部分calc将使用我指定的值,如下所示:
if (isset($_POST['lowercase'])) {
$numChars += 26;
}
if (isset($_POST['uppercase'])) {
$numChars += 26;
}
if (isset($_POST['digits'])) {
$numChars += 10;
}
if (isset($_POST['symbols'])) {
$numChars += 12;
}
if (isset($_POST['ascii'])) {
$numChars = 96;
}
因此,正如您所看到的,如果用户选择了多个复选框,它会将varnumChars中的各个值相加。如果用户选择"All ASCII",那么var应该有一个固定值96,因为这是我感兴趣的可用ASCII字符数。如果勾选了"ASCII"框,我会使用这个论坛其他地方的代码来删除其他框中的复选框。
$(function () {
var el = $('input:checkbox');
el.on('change', function (e) {
if ($(this).attr('id') != 'ascii') {
if ($(this).is(':checked'))
$('#ascii').prop('checked', false);
else {
var l = $(':checkbox')
.filter(':checked')
.not('#ascii').length;
if (l == 0)
$('#ascii').prop('checked', true);
}
} else {
if ($(this).is(':checked'))
el.not($(this)).prop('checked', false);
}
});
});
一切都很好。除了一部分。如果我选择"小写",则numChars为26。如果我选择"大写",则numChars正确地为52。等等。如果我选择"ascii",则numChars将变为96。但如果我选择了其他选项,比如"大写"numChars保持在96,尽管屏幕上的复选框在更新。它只发生在我选择了"ascii"之后,所以无论我在它之后按什么,都需要再次单击才能更新numChars的值。
希望这是有道理的。我试图制作一个jsfiddle,但在ajax方面遇到了困难,尽管我阅读了/echo/html示例..:-)
根据您的要求,您必须将操作代码更改为:
$numChars = 0;
if (isset($_POST['ascii'])) {
$numChars = 96;
}
else
{
if (isset($_POST['lowercase'])) {
$numChars += 26;
}
if (isset($_POST['uppercase'])) {
$numChars += 26;
}
if (isset($_POST['digits'])) {
$numChars += 10;
}
if (isset($_POST['symbols'])) {
$numChars += 12;
}
}
明白了!!
真不敢相信事情竟然这么简单。。。不是都是吗。
我有这个代码:
// submit the form when boxes ticked
$(':checkbox').change (function () {
$("#pForm").submit();
});
以上功能:
$(function(){
var el = $('input:checkbox');
el.on('change', function(e){
if($(this).attr('id')!='ascii')
{
if($(this).is(':checked'))
$('#ascii').prop('checked', false);
else
{
var l = $(':checkbox')
.filter(':checked')
.not('#ascii').length;
if (l == 0)
$('#ascii').prop('checked', true);
}
}
else
{
if ($(this).is(':checked'))
el.not($(this)).prop('checked', false);
}
});
});
把它移到下面就不同了!
相关文章:
- Jquery-每个循环不更新变量
- 函数返回后更新变量
- 我无法通过angularjs中的指令更新变量
- 可以't在quizz页面范围问题上用最终分数更新变量
- 如何在AJAX会话之外更新变量?(Backbone JS/CoffeeScript)
- Javascript 对象方法不更新变量
- 当jquery中的输入发生更改时更新变量
- 无法使用AngularJS更新变量
- 在arr.splice()之后更新变量
- Javascript承诺并更新变量
- jQuery-在输入值更改时更新变量
- 使用数据属性通过 jquery 定位和更新变量
- 从数组中删除不会更新变量内的引用
- 冒泡 从嵌套函数更新变量
- 在 .click 上使用 $.ajax 更新变量
- Javascript - Bootstrap-Slider,如何根据滑块的值更新变量
- JavaScript Ajax 不按时更新变量
- 如何在 JS 中更新变量
- Javascript 没有更新变量
- 在函数中更新变量时,变量不会反映视图中的更新