javascript - 检测用户点击 HTML 表格 TD，并获取值

Question

我试图在访问者点击“td”时发布一些数据。

代码如下:

<form method="post" name="randoms">
<tr><td value="1" name="somedata">Click me 1</td></tr>
<tr><td value="2" name="somedata">Click me 1</td></tr>
<tr><td value="3" name="somedata">Click me 1</td></tr>
<tr><td value="4" name="somedata">Click me 1</td></tr>
</form>

我在这里想要的是，如果访问者单击“单击我 1”，它会发布表单，然后我就可以使用 PHP 获取一些数据。

<?php
$somedata = $_POST["somedata"];
?>

我已经尝试解决这个问题，但我找不到解决这个问题的方法，我很确定有很多方法可以解决。

我试过这个 JavaScript:

<script type="text/javascript">
function submitForm(sub) {
document.forms[sub].submit();
}
</script>

然后我尝试使用:

<a HREF="#" onClick="submitForm('randoms')"> Somedata1 </a>

Answer 1

如前所述，您的表格格式不正确，请添加开始和结束标记

用ban id 或class 命名你的表单<form id="myForm"... >

像在 td 上使用数据属性

<td data-id="1" data-some-data="somename">

在表单中添加2个隐藏输入字段:

<input type="hidden" id="myId" >
<input type="hidden" id="somedata" >    

尝试类似的东西

$( "#myForm td" ).click(function() {
  $('#myId").val($(this).data('id'));
  $('#somedata").val($(this).data('someData'));
  $( "#myForm" ).submit();
});

当然还要设置一个表单操作 url。

如果你真的想要安全，请检查数据属性。像这样存在

if ($(this).data().hasOwnProperty( 'someData') )  { //do stuff } 

好的，如果你想点击特定的 td 为他们添加一个类

<td class="clickable"...... 

修改

 $( "#myForm td" ).click(function() 

到

$( "td.clickable" ).click(function() {