Question

这可能有点难以解释，但我正在显示一个2 x 2的网格。当你点击一个单元格的文本（比如0,1）时，它会弹出一个弹出框和存储隐藏值中的那些坐标。然后，这些隐藏的值将通过POST提交给表单。

以下是我编写的一些示例代码，希望澄清我要做的事情：https://jsfiddle.net/v08bzm9k/1/

<table border=1>
<tr>
  <td class='grid-cells'><a href='#myPopup' data-rel='popup'>1</a></td>
  <td class='grid-cells'><a href='#myPopup' data-rel='popup'>2</a></td>
</tr>
<tr>
  <td class='grid-cells'><a href='#myPopup' data-rel='popup'>3</a></td>
  <td class='grid-cells'><a href='#myPopup' data-rel='popup'>4</a></td>
</tr>
</table>

<div data-role="popup" id="myPopup" class="ui-content" style="min-width:250px;">
      <form method="post" action="save-square.php">
        <div>
          <h3>Pick This Square:</h3>
          <label for="name" class="ui-hidden-accessible">Name:</label>
          <input type="text" name="name" id="name" placeholder="Name">
          <label for="email" class="ui-hidden-accessible">Email:</label>
          <input type="text" name="email" id="email" placeholder="Email">
          <input type="submit" data-inline="true" value="Submit">
          <div id='row'></div>
          <div id='col'></div>
        </div>
      </form>
    </div>

我会通过JavaScript将我点击的单元格的值存储到隐藏字段吗？

Answer 1

我更新了https://jsfiddle.net/v08bzm9k/2/

是的，您可以使用隐藏字段。在您的表单中添加：

<input type="hidden" name="coords" id="coords" value="">

将此JS添加到您的页面：

function setCoords(newCoords) {
    $('#coords').val(newCoords);
}

在您的链接中添加onClick：

<a href='#myPopup' data-rel='popup' onclick="setCoords('1,1');">1</a>

从表格HTML中快速获取数据

1 个答案: