0
4つの入力フィールドがあり、jquery .keyupを使用して最初の3つのフィールドの1つに数字を入力すると合計4つの入力フィールドになります。 .keyupが4番目に入力されたときに実行される一連のif else文もあります。それらは.keyupの値を決定し、特定の数のパス（ボトル）をラファエル紙に描画します。複数の入力フィールドはローディングバーの進行を制御する別の入力フィールドを追加します
私がしたいことは、最初の3つの値のうちの1つが入力されたときです.4つ目の合計がif else文に渡され、ラファエル紙に何本のパス（ボトル） 。 4番目の入力に直接入力する必要はありません。
カーソルが入力フィールドにない限り、.keyupはこれで動作しないようです。 .textによって生成されている入力フィールドから情報を取得する別の方法は何ですか？基本的に私が探しているものです。
これはうまくいけばうまくいきます。 updateTotalの終わりに$('#total1')に
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);
}
});
これは私にとってはうまくいかないようです。しかし、私はそれを把握しました。とにかく、ありがとう。 –
私があなたに与えたjsfiddleはうまくいきませんでしたか？どのブラウザ/ OSですか？ IE/Chrome/Firefoxの最新のWindowsで動作します。 –
ありがとう。 –