基于ajax调用标记的按钮；单击时，按钮文本添加到输入框

Question

我有 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. 仍然在 ajax 成功内，直接使用数组 (letArr[z]) 和 (letterArr[ran2]) 中的值，但两者都没有在 console.log 中显示超过 .text(letArr[z]) 和 .text(字母Arr[ran2])
4.最后，把它放在一个函数中，在ajax成功并传递参数时调用，但这也不起作用。

我不确定如何去做我想要发生的事情，我只是在尝试组合，看看什么会起作用。有人可以指出我正确的方向吗？基本上我想要的是，当单击按钮时，无论按钮的标签/文本是什么，它都会被添加到输入字段中的任何内容中。

提前致谢！

Answer 1

首先，我无法想象这是为了什么，这让我有点好奇。

我也不清楚您提供的代码中的故障在哪里。

我建议使用 input type="button" 而不是按钮...这样您可以轻松获取值...然后确保它们所有元素都正确分配了值（您可以检查您的浏览器网络开发者工具/萤火虫）....然后得到这样的工作（不是100％确定获得价值的最佳方式......您可能需要通过ID来获得它）

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

然后继续将其插入到输入中（这应该很简单，例如...）

$("#R" + c + "anstext").val(this.value);