15 個のボタンがあり、ajax のデータを使用してランダムにラベル付けされています。次に必要なのは、これらのボタンをクリックすると、対応する入力ボックスにあるものにボタン テキスト (1 文字のみ) が追加されることです。各ボタンと入力には、その行に基づいた一意の ID があります。各行には 15 個のボタンがあります。
行 1 ボタンの HTML コード (多数の行があります)。ボタンは、jQuery UI を介してボタン化されません。
<table width="180" border="0">
<tr>
<td><button id="R1L1butt" class="letters"></button></td>
<td><button id="R1L2butt" class="letters"></button></td>
<td><button id="R1L3butt" class="letters"></button></td>
<td><button id="R1L4butt" class="letters"></button></td>
<td><button id="R1L5butt" class="letters"></button></td>
</tr>
<tr>
<td><button id="R1L6butt" class="letters"></button></td>
<td><button id="R1L7butt" class="letters"></button></td>
<td><button id="R1L8butt" class="letters"></button></td>
<td><button id="R1L9butt" class="letters"></button></td>
<td><button id="R1L10butt" class="letters"></button></td>
</tr>
<tr>
<td><button id="R1L11butt" class="letters"></button></td>
<td><button id="R1L12butt" class="letters"></button></td>
<td><button id="R1L13butt" class="letters"></button></td>
<td><button id="R1L14butt" class="letters"></button></td>
<td><button id="R1L15butt" class="letters"></button></td>
</tr>
</table>
これが私の最新のコードです:
//This is part of ajax success
//letArr is an array where the data from ajax is stored
//row2 is also from ajax
//ranArr is an array that contains the numbers 1-15
//letterArr is an array that contains the letters from A-Z
//This part works (except for the bindbuttons function)
for (var z=0; z<letArr.length; z++) //label random buttons depending on the data from ajax
{
ran1 = Math.floor(Math.random()*ranArr.length);
$("#R" + row2 + "L" + ranArr[ran1] + "butt").text(letArr[z]);
bindbuttons(row2, ranArr[ran1], letArr[z]);
ranArr.splice(ran1, 1);
}
for (var a=0; a<(15-letArr.length); a++) //fill in the other buttons with random letters
{
ran1 = Math.floor(Math.random()*ranArr.length);
ran2 = Math.floor(Math.random()*letterArr.length);
$("#R" + row2 + "L" + ranArr[ran1] + "butt").text(letterArr[ran2]);
bindbuttons(row2, ranArr[ran1], letterArr[ran2]);
ranArr.splice(ran1, 1);
}
次に、これはバインド関数です。
function bindbuttons(c, d, e)
{
$("#R" + c + "L" + d + "butt").on("click", function() {
$("#R" + c + "anstext").val( function (i, v) {
return v + e;
});
});
}
私は次のことを試しました:
1. .text() と .html() を切り替えて、ボタンにラベルを付けようとしました。どちらもうまくいきます。
2. ajax 成功内で、.on (直接バインドするため) と $(this).text を使用しますが、console.log にはテキストが表示されません。
3. 配列 (letArr[z]) および (letterArr[ran2]) から直接値を使用して、依然として ajax の成功の範囲内ですが、両方ともその .text(letArr[z]) および .text( を過ぎて console.log に表示されません。 letterArr[ran2])
4. 最後に、ajax 成功内で呼び出される関数に入れ、パラメーターを渡しますが、それもうまくいきません。
どうすればいいのかわからず、うまくいく組み合わせを試しているところです。誰かが私を正しい方向に向けることができますか? 基本的に私が欲しいのは、ボタンをクリックすると、ボタンのラベル/テキストが何であれ、入力フィールドにあるものに追加されることです。
前もって感謝します!