0

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 成功内で呼び出される関数に入れ、パラメーターを渡しますが、それもうまくいきません。

どうすればいいのかわからず、うまくいく組み合わせを試しているところです。誰かが私を正しい方向に向けることができますか? 基本的に私が欲しいのは、ボタンをクリックすると、ボタンのラベル/テキストが何であれ、入力フィールドにあるものに追加されることです。

前もって感謝します!

4

1 に答える 1

0

まず、これが何のためにあるのか想像できず、ちょっと興味があります。

また、提示されたコードのどこに障害があるのか​​ も明確ではありません。

私がお勧めするのは、ボタンではなく input type="button" を使用することです...この方法で値を簡単に取得できます....そして、すべての要素が適切に割り当てられた値を取得していることを確認してください(ブラウザのWeb開発者で確認できますtools / firebug)....次に、このようなものが機能するようにします(値を取得するための最良の方法が 100% 確実であるとは限りません...ID を介して取得する必要がある場合があります)。

function bindbuttons(c, d, e)
{
  $("#R" + c + "L" + d + "butt").on("click", function() {
    alert(this.value);
  });
}

次に、それを入力に挿入します(これは簡単なはずです...)

$("#R" + c + "anstext").val(this.value);
于 2013-08-30T20:15:59.000 に答える