0
我有4个输入字段，当数字输入到前3个使用jquery .keyup之一时，他们被合计并添加到第四个。我还有一系列if。else语句，当.keyup输入到第四个时，它们将确定.keyup的值，并为raphael纸张绘制一定数量的路径（瓶子）。多个输入字段添加到另一个输入字段，控制加载栏的进度
我想要做的是，当前三个值中的一个输入时，我希望将第四个总数传递给if语句并决定将多少路径（瓶子）拉到raphael纸上。而不必直接输入第四个输入。
似乎.keyup不会为此工作，除非光标在输入字段。从.text生成的输入字段获取信息的另一种方法是什么？基本上是我正在寻找的。
希望这是有道理的。
http://jsfiddle.net/anderskitson/QX9C7/
$('#the_input_id').keyup(function() {
updateTotal();
});
$('#the_input_id1').keyup(function() {
updateTotal();
});
$('#the_input_id2').keyup(function() {
updateTotal();
});
var updateTotal = function() {
var input1 = parseInt($('#the_input_id').val());
var input2 = parseInt($('#the_input_id1').val());
var input3 = parseInt($('#the_input_id2').val());
if (isNaN(input1) || isNaN(input2) || isNaN(input3)) {
$('#total').text('');
} else {
var max = 300;
var total = input1 + (input2 * 2) + (input3 * 3);
if (total > max) {
$('#total').text('The maximum is ' + max);
$('#total1').val(500);
} else {
$('#total1').val(total);
}
}
};
var default_val = '';
$('input[class^="class-"]').focus(function() {
if ($(this).val() == $(this).data('default_val') || !$(this).data('default_val')) {
$(this).data('default_val', $(this).val());
$(this).val('');
}
});
$('input[class^="class-"]').blur(function() {
if ($(this).val() == '') {
$(this).val($(this).data('default_val'));
}
});
var paper = Raphael(document.getElementById("notepad"), 400, 70);
function drawBottles(count) {
for (i = 0; i < count; i++) {
var randomNumber3 = Math.floor(Math.random() * 25);
var path_a = paper.path("M242.07,270.119c0,0-14.596-30.606-7.625-35.793 c3.864-2.876,2.145-18.561,1.832-18.784c-0.313-0.224-1.839-0.319-1.839-0.319c-1.555-0.192-0.201-3.456-0.201-3.456 s0,0-0.598-0.352c-0.598-0.351,1.129-1.345,1.129-1.345c3.738-2.785,10.449-2.983,11.126-2.344c0.677,0.64-0.354,1.44-0.354,1.44 s0.73,0.832,1.333,2.111c0.604,1.28-0.792,1.665-0.792,1.665c1.852,6.718,9.877,14.935,9.877,14.935 c4.795,0.589,7.7,10.683,7.7,10.683l6.271,22.746C269.929,261.307,263.641,270.119,242.07,270.119z");
path_a.attr({
fill: 'none',
stroke: '#231F20',
"stroke-width": '3',
"stroke-miterlimit": '10',
'stroke-opacity': '1'
}).data('id', 'path_a');
path_a.translate((i * 30) - 225, -200);
path_a.rotate(randomNumber3);
} //end of for statement
}
$("#total1").keyup(function() {
var val = $(this).val();
if (val.length === 0) {
paper.clear();
$("#max").text('');
return;
}
var value = parseInt(val);
paper.clear();
if (value > 300) {
drawBottles(10);
$("#max").text('you have reached the maximum');
} else if (value > 270) {
drawBottles(10);
} else if (value > 240) {
drawBottles(9);
} else if (value > 210) {
drawBottles(8);
} else if (value > 180) {
drawBottles(7);
} else if (value > 150) {
drawBottles(6);
} else if (value > 120) {
drawBottles(5);
} else if (value > 90) {
drawBottles(4);
} else if (value > 60) {
drawBottles(3);
} else if (value > 30) {
drawBottles(2);
} else if (value != 0 && 0 != value.length) {
drawBottles(1);
}
});
这似乎不适用于我。但我确实弄清楚了。不管怎么说，多谢拉。 – 2012-02-28 20:30:16
我给你的jsfiddle没有工作？什么浏览器/ OS？适用于IE/Chrome/Firefox最新版Windows。 – 2012-02-28 20:31:24
非常感谢。 – 2012-02-28 20:35:12